Skip to content

Commit

Permalink
Add and document the earlyBootSet config option
Browse files Browse the repository at this point in the history
  • Loading branch information
NullVoxPopuli committed Dec 15, 2022
1 parent b7e163a commit dbade59
Show file tree
Hide file tree
Showing 6 changed files with 96 additions and 31 deletions.
1 change: 1 addition & 0 deletions packages/ember-auto-import/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ let app = new EmberApp(defaults, {
Supported Options

- `alias`: _object_, Map from imported names to substitute names that will be imported instead. This is a prefix match by default. To opt out of prefix-matching and only match exactly, add a `$` suffix to the pattern.
- `earlyBootSet`: _function, returning an array of strings_, defaults to undefined, but when used, the function will receive the default earlyBootSet, which is a list of common modules found at the source of rare timing / package / ordering issues in the compatibility / cross-communication between requirejs and webpack. This is a temporary escape hatch to allow non-embroider apps to consume v2 addons at any place in their dependency graph to help ease transitioning to embroider as this problem doesn't occur once an app is using embroider. See [issue#504](https://github.com/ef4/ember-auto-import/issues/504) for details. Note that if any modules listed here belong to v2 addons, they will be removed from the set. To opt out of default behavior, return an empty array.
- `exclude`: _list of strings, defaults to []_. Packages in this list will be ignored by ember-auto-import. Can be helpful if the package is already included another way (like a shim from some other Ember addon).
- `forbidEval`: _boolean_, defaults to false. We use `eval` in development by default (because that is the fastest way to provide sourcemaps). If you need to comply with a strict Content Security Policy (CSP), you can set `forbidEval: true`. You will still get sourcemaps, they will just use a slower implementation.
- `insertScriptsAt`: _string_, defaults to undefined. Optionally allows you to take manual control over where ember-auto-import's generated `<script>` tags will be inserted into your HTML and what attributes they will have. See "Customizing HTML Insertion" below.
Expand Down
2 changes: 2 additions & 0 deletions packages/ember-auto-import/ts/auto-import.ts
Original file line number Diff line number Diff line change
Expand Up @@ -151,6 +151,8 @@ export default class AutoImport implements AutoImportSharedAPI {
publicAssetURL: this.rootPackage.publicAssetURL(),
webpack,
hasFastboot: this.rootPackage.isFastBootEnabled,
earlyBootSet: this.rootPackage.earlyBootSet,
v2Addons: this.v2Addons,
});
}

Expand Down
2 changes: 2 additions & 0 deletions packages/ember-auto-import/ts/bundler.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ export interface BundlerOptions {
browserslist: string;
webpack: typeof webpack;
hasFastboot: boolean;
earlyBootSet: undefined | ((defaultModules: string[]) => string[]);
v2Addons: Map<string, string>;
}

export interface BuildResult {
Expand Down
12 changes: 12 additions & 0 deletions packages/ember-auto-import/ts/package.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ export interface Options {
alias?: { [fromName: string]: string };
webpack?: Configuration;
publicAssetURL?: string;
earlyBootSet?: (defaultModules: string[]) => string[];
styleLoaderOptions?: Record<string, unknown>;
cssLoaderOptions?: Record<string, unknown>;
miniCssExtractPluginOptions?: Record<string, unknown>;
Expand Down Expand Up @@ -413,6 +414,17 @@ export default class Package {
);
}

/**
* The function for defining the early boot set.
* Used when we begin building entry files for webpack, so that we can query all packages listed
* in the early boot set to check if they are v2 addons --if they are v2 addons,
* we remove them from the early boot set, as this feature is for a rare compatibility circumstance that
* only affects v1 addons consumed by v2 addons.
*/
get earlyBootSet(): undefined | ((defaults: string[]) => string[]) {
return this.isAddon ? undefined : this.autoImportOptions?.earlyBootSet;
}

get styleLoaderOptions(): Record<string, unknown> | undefined {
// only apps (not addons) are allowed to set this
return this.isAddon
Expand Down
105 changes: 75 additions & 30 deletions packages/ember-auto-import/ts/webpack.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,36 @@ import MiniCssExtractPlugin from 'mini-css-extract-plugin';

const debug = makeDebug('ember-auto-import:webpack');

/**
* Passed to and configuable with autoImport.earlyBootset
* example:
* ```js
* // ember-cli-build.js
* // ...
* autoImport: {
* earlyBootSet: (defaultModules) => {
* return [
* ...defaultModules,
* 'my-package/my-module,
* ];
* }
* }
* ```
*
* Anything listed in the return value from this function that is from a v2 addon will be removed.
* (Allowing each of these packages from the default set to be incrementally converted to v2 addons
* without the need for this code to be updated)
*
*/
const DEFAULT_EARLY_BOOT_SET = [
'@glimmer/tracking',
'@glimmer/component',
'@ember/service',
'@ember/controller',
'@ember/routing/route',
'@ember/component',
];

registerHelper('js-string-escape', jsStringEscape);
registerHelper('join', function (list, connector) {
return list.join(connector);
Expand Down Expand Up @@ -390,39 +420,54 @@ export default class WebpackBundler extends Plugin implements Bundler {
return output;
}

/**
* TODO:
private getEarlyBootSet() {
let result = this.opts.earlyBootSet
? this.opts.earlyBootSet(DEFAULT_EARLY_BOOT_SET)
: DEFAULT_EARLY_BOOT_SET;

if (!Array.isArray(result)) {
throw new Error(
'autoImport.earlyBootSet was used, but did not return an array. An array of strings is required'
);
}

// Reminder: [/* empty array */].every(anything) is true
if (!result.every((entry) => typeof entry === 'string')) {
throw new Error(
'autoImport.earlyBootSet was used, but the returned array did contained data other than strings. Every element in the return array must be a string representing a module'
);
}

* @param name
* @param deps
*/
private writeEntryFile(name: string, deps: BundleDependencies) {
/**
* TODO:
* - what happens when one of these depends on a v2 addon?
* - what happens when one of these is converted to a v2 addon?
* - how can an app configure / change this list?
* - need a way to opt out?
* - need a way to add
* - "what's the list of v1 addons that need to load before v2 addons"
* - change the require logic (in development), to provide better messaging
* for the scenario when these v1 addons aren't noticed to the loader
* Not all of the emberVirtualPackages and emberVirtualPeers
* exist in every version of ember-source.
*
* We will only specify modules from v1 addons with exports known to be used in module-scope.
*
* Over time, we can check the package.json for these packages and see if they've been
* converted to v2, then exclude them from this list.
* TODO: iterate over these and check their dependencies if any depend on a v2 addon
* - when this situation occurs, check that v2 addon's dependencies if any of those are v1 addons,
* - if so, log a warning, about potentially needing to add modules from that v1 addon to the early boot set
*/
let v1EmberDeps: string[] = [
'@glimmer/tracking',
'@glimmer/component',
'@ember/service',
'@ember/controller',
'@ember/routing/route',
'@ember/component',
];
let v2Addons = this.opts.v2Addons.keys();

result = result.filter((modulePath) => {
for (let v2Addon of v2Addons) {
// Omit modulePaths from v2 addons
if (modulePath.startsWith(v2Addon)) {
if (!DEFAULT_EARLY_BOOT_SET.includes(v2Addon)) {
console.warn(
`\`${modulePath}\` was included in the \`autoImport.earlyBootSet\` list, but belongs to a v2 addon. You can remove this entry from the earlyBootSet`
);
}

return false;
}
}

return true;
});

return result;
}

private writeEntryFile(name: string, deps: BundleDependencies) {
let v1EmberDeps: string[] = this.getEarlyBootSet();

writeFileSync(
join(this.stagingDir, `${name}.cjs`),
entryTemplate({
Expand Down
5 changes: 4 additions & 1 deletion test-scenarios/v2-addon-test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -168,12 +168,15 @@ function buildInnerV2Addon(name: string) {
module.exports = addonV1Shim(__dirname);
`,
'index.js': `
import { tracked } from '@glimmer/tracking';
console.log({ tracked }, 'accessing a v1 addon thing in module space');
export function innerV2Addon() {
return '${name}-worked';
}
`,
},
});
addon.linkDependency('@glimmer/tracking', { baseDir: __dirname });
addon.linkDependency('@embroider/addon-shim', { baseDir: __dirname });
addon.pkg.keywords = addon.pkg.keywords ? [...addon.pkg.keywords, 'ember-addon'] : ['ember-addon'];
addon.pkg['ember-addon'] = {
Expand Down Expand Up @@ -603,7 +606,7 @@ export let Cell = (_class = class Cell {
}).forEachScenario(scenario => {
Qmodule(scenario.name, function(hooks) {
let app: PreparedApp;
hooks.beforeEach(async () => {
hooks.before(async () => {
app = await scenario.prepare();
});
test('ensure success', async function (assert) {
Expand Down

0 comments on commit dbade59

Please sign in to comment.