Skip to content

Commit

Permalink
Stop bundling dependencies (#62)
Browse files Browse the repository at this point in the history
  • Loading branch information
fregante committed Jul 28, 2022
1 parent 34a9d89 commit a392da1
Show file tree
Hide file tree
Showing 9 changed files with 83 additions and 150 deletions.
8 changes: 4 additions & 4 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ jobs:
Lint:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v2
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: 16
- name: install
Expand All @@ -25,7 +25,7 @@ jobs:
Test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v3
- name: install
run: npm ci || npm install
- name: build
Expand All @@ -36,7 +36,7 @@ jobs:
Build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v3
- name: install
run: npm ci || npm install
- name: build
Expand Down
39 changes: 21 additions & 18 deletions .github/workflows/esm-lint.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ env:

# FILE GENERATED WITH: npx ghat fregante/ghatemplates/esm-lint
# SOURCE: https://github.com/fregante/ghatemplates
# OPTIONS: {"exclude":["jobs.Rollup"]}

name: ESM
on:
Expand All @@ -18,19 +19,19 @@ jobs:
Pack:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/checkout@v3
- run: npm install
- run: npm run build --if-present
- run: npm pack --dry-run
- run: npm pack | tail -1 | xargs -n1 tar -xzf
- uses: actions/upload-artifact@v2
- uses: actions/upload-artifact@v3
with:
path: package
Webpack:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- uses: actions/download-artifact@v3
- run: npm install ./artifact
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.js
- run: webpack --entry ./index.js
Expand All @@ -39,44 +40,46 @@ jobs:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- uses: actions/download-artifact@v3
- run: npm install ./artifact
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.js
- run: npx parcel build index.js
- run: npx parcel@2 build index.js
- run: cat dist/index.js
Rollup:
Vite:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- run: npm install ./artifact rollup@2 @rollup/plugin-node-resolve
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.js
- run: npx rollup -p node-resolve index.js
Snowpack:
- uses: actions/download-artifact@v3
- run: npm install ./artifact
- run: >-
echo '<script type="module">${{ env.IMPORT_TEXT }} "${{
env.NPM_MODULE_NAME }}"</script>' > index.html
- run: npx vite build
- run: cat dist/assets/*
esbuild:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- uses: actions/download-artifact@v3
- run: echo '{}' > package.json
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.js
- run: npm install ./artifact
- run: npx snowpack@2 build
- run: cat build/web_modules/$NPM_MODULE_NAME.js
- run: npx esbuild --bundle index.js
TypeScript:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- run: npm install ./artifact
- uses: actions/download-artifact@v3
- run: npm install ./artifact && npm install @types/estree
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.ts
- run: tsc index.ts
- run: cat index.js
Node:
runs-on: ubuntu-latest
needs: Pack
steps:
- uses: actions/download-artifact@v2
- uses: actions/setup-node@v1
- uses: actions/download-artifact@v3
- uses: actions/setup-node@v3
with:
node-version: 14.x
- run: echo "${{ env.IMPORT_TEXT }} '${{ env.NPM_MODULE_NAME }}'" > index.mjs
Expand Down
10 changes: 3 additions & 7 deletions globals.d.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1,14 @@
declare module 'dom-form-serializer/lib/serialize' {
declare module 'dom-form-serializer/dist/dom-form-serializer.mjs' {
import {JsonObject} from 'type-fest';

export default function serialize(
export function serialize(
element: HTMLFormElement,
options: {
include?: string[];
}
): JSONValue;
}

declare module 'dom-form-serializer/lib/deserialize' {
import {JsonObject} from 'type-fest';

export default function deserialize(
export function deserialize(
element: HTMLFormElement,
serializedData: JsonObject,
options?: {
Expand Down
82 changes: 30 additions & 52 deletions index.ts
Original file line number Diff line number Diff line change
@@ -1,34 +1,28 @@
import {debounce} from 'throttle-debounce';
import serialize from 'dom-form-serializer/lib/serialize';
import deserialize from 'dom-form-serializer/lib/deserialize';
import chromeP from 'webext-polyfill-kinda';
import {isBackground} from 'webext-detect-page';
import {compressToEncodedURIComponent, decompressFromEncodedURIComponent} from 'lz-string';
import {serialize, deserialize} from 'dom-form-serializer/dist/dom-form-serializer.mjs';
import LZString from 'lz-string';

// eslint-disable-next-line @typescript-eslint/naming-convention -- CJS in ESM imports
const {compressToEncodedURIComponent, decompressFromEncodedURIComponent} = LZString;

async function shouldRunMigrations(): Promise<boolean> {
const self = await chromeP.management?.getSelf();

// Always run migrations during development #25
if (self?.installType === 'development') {
return true;
}

return new Promise(resolve => {
const callback = (installType: string): void => {
// Always run migrations during development #25
if (installType === 'development') {
resolve(true);
return;
}
// Run migrations when the extension is installed or updated
chrome.runtime.onInstalled.addListener(() => {
resolve(true);
});

// Run migrations when the extension is installed or updated
chrome.runtime.onInstalled.addListener(() => {
resolve(true);
});

// If `onInstalled` isn't fired, then migrations should not be run
setTimeout(resolve, 500, false);
};

if (chrome.management?.getSelf) {
chrome.management.getSelf(({installType}) => {
callback(installType);
});
} else {
callback('unknown');
}
// If `onInstalled` isn't fired, then migrations should not be run
setTimeout(resolve, 500, false);
});
}

Expand Down Expand Up @@ -113,8 +107,6 @@ class OptionsSync<UserOptions extends Options> {
this.storageName = storageName;
this.defaults = defaults;
this.storageType = storageType;
this._handleFormInput = debounce(300, this._handleFormInput.bind(this));
this._handleStorageChangeOnForm = this._handleStorageChangeOnForm.bind(this);

if (!logging) {
this._log = () => {};
Expand All @@ -123,8 +115,8 @@ class OptionsSync<UserOptions extends Options> {
this._migrations = this._runMigrations(migrations);
}

get storage(): chrome.storage.StorageArea {
return chrome.storage[this.storageType];
get storage(): chromeP.storage.StorageArea {
return chromeP.storage[this.storageType];
}

/**
Expand Down Expand Up @@ -198,29 +190,14 @@ class OptionsSync<UserOptions extends Options> {
}

private async _getAll(): Promise<UserOptions> {
return new Promise<UserOptions>((resolve, reject) => {
this.storage.get(this.storageName, result => {
if (chrome.runtime.lastError) {
reject(chrome.runtime.lastError);
} else {
resolve(this._decode(result[this.storageName]));
}
});
});
const result = await this.storage.get(this.storageName);
return this._decode(result[this.storageName]);
}

private async _setAll(newOptions: UserOptions): Promise<void> {
this._log('log', 'Saving options', newOptions);
return new Promise((resolve, reject) => {
this.storage.set({
[this.storageName]: this._encode(newOptions),
}, () => {
if (chrome.runtime.lastError) {
reject(chrome.runtime.lastError);
} else {
resolve();
}
});
await this.storage.set({
[this.storageName]: this._encode(newOptions),
});
}

Expand Down Expand Up @@ -266,7 +243,8 @@ class OptionsSync<UserOptions extends Options> {
}
}

private async _handleFormInput({target}: Event): Promise<void> {
// eslint-disable-next-line @typescript-eslint/member-ordering -- Needs to be near _handleFormSubmit
private readonly _handleFormInput = debounce(300, async ({target}: Event): Promise<void> => {
const field = target as HTMLInputElement;
if (!field.name) {
return;
Expand All @@ -276,7 +254,7 @@ class OptionsSync<UserOptions extends Options> {
field.form!.dispatchEvent(new CustomEvent('options-sync:form-synced', {
bubbles: true,
}));
}
});

private _handleFormSubmit(event: Event): void {
event.preventDefault();
Expand Down Expand Up @@ -312,15 +290,15 @@ class OptionsSync<UserOptions extends Options> {
return serialize(form, {include});
}

private _handleStorageChangeOnForm(changes: Record<string, any>, areaName: string): void {
private readonly _handleStorageChangeOnForm = (changes: Record<string, any>, areaName: string): void => {
if (
areaName === this.storageType
&& changes[this.storageName]
&& (!document.hasFocus() || !this._form!.contains(document.activeElement)) // Avoid applying changes while the user is editing a field
) {
this._updateForm(this._form!, this._decode(changes[this.storageName].newValue));
}
}
};
}

export default OptionsSync;
51 changes: 23 additions & 28 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,16 +16,15 @@
"author": "Federico Brigante <me@fregante.com> (https://fregante.com)",
"type": "module",
"main": "index.js",
"module": "index.js",
"files": [
"index.js",
"index.d.ts"
],
"scripts": {
"build": "rollup -c",
"prepack": "rollup -c",
"build": "tsc",
"prepack": "tsc",
"test": "run-p build ava xo",
"watch": "rollup -c --watch",
"watch": "tsc --watch",
"ava": "ava",
"xo": "xo"
},
Expand All @@ -35,39 +34,35 @@
"webextensions"
],
"rules": {
"@typescript-eslint/no-unsafe-call": "off",
"@typescript-eslint/no-unsafe-return": "off",
"@typescript-eslint/no-unsafe-member-access": "off",
"@typescript-eslint/no-duplicate-imports": "off",
"@typescript-eslint/no-dynamic-delete": "off",
"@typescript-eslint/no-empty-function": "off",
"import/no-duplicates": "off",
"import/no-unassigned-import": "off"
"@typescript-eslint/no-empty-function": "off"
}
},
"ava": {
"require": [
"./test/_env.js"
]
},
"dependencies": {
"webext-detect-page": "^4.0.0"
"dom-form-serializer": "^2.0.0",
"lz-string": "^1.4.4",
"throttle-debounce": "^5.0.0",
"webext-detect-page": "^4.0.1",
"webext-polyfill-kinda": "^0.10.0"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^21.0.1",
"@rollup/plugin-node-resolve": "^13.1.3",
"@rollup/plugin-typescript": "^8.3.0",
"@sindresorhus/tsconfig": "^2.0.0",
"@types/chrome": "0.0.176",
"@types/estree": "^0.0.50",
"@sindresorhus/tsconfig": "^3.0.1",
"@types/chrome": "0.0.193",
"@types/firefox-webext-browser": "^94.0.1",
"@types/lz-string": "^1.3.34",
"@types/throttle-debounce": "^2.1.0",
"ava": "^4.0.1",
"dom-form-serializer": "^2.0.0",
"lz-string": "^1.4.4",
"@types/throttle-debounce": "^5.0.0",
"ava": "^4.3.1",
"npm-run-all": "^4.1.5",
"rollup": "^2.63.0",
"rollup-plugin-terser": "^7.0.2",
"sinon": "^12.0.1",
"sinon": "^14.0.0",
"sinon-chrome": "^3.0.1",
"throttle-debounce": "^3.0.1",
"type-fest": "^2.9.0",
"typescript": "^4.5.4",
"xo": "^0.47.0"
"type-fest": "^2.17.0",
"typescript": "^4.7.4",
"xo": "^0.51.0"
}
}
Loading

0 comments on commit a392da1

Please sign in to comment.