V2 addon #397

SergeAstapov · 2022-03-02T04:40:25Z

No description provided.

SergeAstapov · 2022-03-11T04:03:32Z

test-app/package.json

-    "ember-animated": "0.12.0",
-    "ember-animated-tools": "github:ember-animation/ember-animated-tools#1edcfd7f0be0a9b4b69450f0fc4d945f31277215",
+    "ember-animated": "workspace:*",
+    "ember-animated-tools": "file:../ember-animated-tools-0.5.0.tgz",


As ember-animated-toolsnow a monorepo, we can't use github:ember-animation/ember-animated-tools#v2-addon scheme.

as temp workaround, packed ember-animated-tools and used here.

Once ember-animated-tools published to npm (via beta or actual release), will have a follow up PR to point back to npm.

SergeAstapov · 2022-03-11T04:04:13Z

test-app/config/ember-try.js


 module.exports = async function () {
  return {
    usePnpm: true,
    scenarios: [
-      {
-        name: 'ember-lts-3.12',


template co-location needs 3.13 (unless I'm missing something)

SergeAstapov · 2022-03-11T04:08:28Z

docs/package.json

    "ember-auto-import": "^2.4.0",
    "ember-cli": "~4.1.1",
-    "ember-cli-addon-docs": "^4.2.1",
+    "ember-cli-addon-docs": "file:./ember-cli-addon-docs-4.2.2.tgz",


Couldn't just use branch from ember-learn/ember-cli-addon-docs#1164 as had to remove prepare script otherwise it was trying to link some packages which was failing under ember-animated.

We actually may need to restructure ember-cli-addon-docs into monorepo to get rid from that scripts/link-them.sh but it's another story.

SergeAstapov · 2022-03-11T04:15:12Z

addon/src/test-support/time-control.js


-let origNow = clock.now;
+let origNow = getOrCreate('time-control', () => clock.now);


@ef4 so this is the "trick" I've mentioned during Embroider Office Hour, which is a workaround for embroider-build/ember-auto-import#503

SergeAstapov · 2022-03-11T04:16:25Z

addon/src/test-support/index.js

 import TimeControl from './time-control';

 export { TimeControl };
 export { default as MotionTester } from './motion-tester';

+// Re-export to ensure "instanceof" works properly within MotionTester.


@ef4 and this is second part of the trick to make sure we use same entry-point for the code used in tests that involve instanceof which is a workaround for embroider-build/ember-auto-import#503

SergeAstapov · 2022-03-11T04:21:40Z

addon/src/-private/sprite.ts

@@ -1297,7 +1298,30 @@ class CopiedCSS {
  'box-shadow': string;
 }

-const COPIED_CSS_PROPERTIES = Object.keys(new CopiedCSS());
+const COPIED_CSS_PROPERTIES = [


The snippet Object.keys(new CopiedCSS()); did not work anymore as TS was removing ass unused class properties defined in CopiedCSS class.

As far as I understand, this is expected TS behavior hence made the list of props separately from the class interface.

SergeAstapov · 2022-03-11T04:22:41Z

addon/src/-private/singleton.ts

+// We should remove this file and getOrCreate usage once ember-auto-import gets fixed,
+// so we would have single entry point for app and tests.
+// Link to track status: https://github.com/ef4/ember-auto-import/issues/503
+export function getOrCreate<T>(key: string, construct: () => T): T {


this is heart of the "true singleton across webpack entrypoints".
hacky but works 🙃

SergeAstapov · 2022-03-11T04:23:41Z

addon/src/-private/ember-scheduler.ts

@@ -38,11 +38,7 @@ let handlerCounter = 0;

 let BaseTaskProperty: { new (): HostObject };

-if (gte('3.10.0')) {


there is no more support for Ember <3.10

SergeAstapov · 2022-03-11T04:26:22Z

addon/addon-main.js

+  init(...args) {
+    this._super.init.apply(this, args);
+
+    this.treePaths.addon = 'src';


this is needed for ember-cli-addon-docs to property find addon code, part of ember-learn/ember-cli-addon-docs#1164

I was thinking we actually should move this to @embroider/addon-shim, @ef4 what do you think?

SergeAstapov · 2022-03-11T04:32:30Z

addon/babel.config.json

+      "@babel/plugin-proposal-decorators", {
+        "version": "legacy"
+      }
+    ]


I had an issue with @babel/plugin-proposal-class-properties and decided to remove it.

I had a problem with decorated class properties.
e.g. @service('-ea-motion') motionService!: MotionService; was properly transpiled to decorate class property, but in addition I got this.motionService = null added to the constructor which cleaned up property value.

I assume class properties actually would be processed by babel in the consuming app at build time.

e.g. if app supports only latest browser with class properties support, having @babel/plugin-proposal-class-properties plugin in the addon would still transpile it to ES6 which does not seem to me as ideal behavior.

I'm 100% missing something here but not sure what.

ef4

Looking great, thanks for all your hard work.

I left one question but that's not a blocker.

I'm fine with the workarounds for the module duplication problem. In general it's healthy for NPM packages to be tolerant of duplication, even if in this case the duplication is a bug.

ef4 · 2022-03-16T17:18:05Z

addon/rollup.config.js

+    // These are the modules that users should be able to import from your
+    // addon. Anything not listed here may get optimized away.
+    addon.publicEntrypoints([
+      '-private/**/*.{js,ts}',


Can we remove this? I would have thought nothing in the app should be trying to import from these paths.

@ef4 there are bunch of unit tests importing from -private folder, e.g. https://github.com/ember-animation/ember-animated/blob/master/test-app/tests/unit/adjust-color-test.js

I'm not sure there is way to make it without having -private in publicEntrypoints

Ah, I see.

We will have to think about whether there's a nice way for v2 addons to have a test build that offers entrypoints to the test app that aren't part of the published build (without risking that tests become unrealistic).

SergeAstapov added the breaking label Mar 2, 2022

SergeAstapov force-pushed the convert-monorepo branch 2 times, most recently from 220f996 to 30ea400 Compare March 2, 2022 05:33

Base automatically changed from convert-monorepo to master March 2, 2022 20:46

SergeAstapov force-pushed the v2-addon branch 2 times, most recently from a5fca08 to c8052cf Compare March 2, 2022 20:57

SergeAstapov added 2 commits March 8, 2022 15:49

Porting an Addon to V2

15d15d1

use ember-animated as v2 addon

ad61690

SergeAstapov force-pushed the v2-addon branch from 398f32d to 87fce01 Compare March 10, 2022 05:42

Fix issues caused by webpack chunks

4e301a4

SergeAstapov force-pushed the v2-addon branch from 87fce01 to 4e301a4 Compare March 10, 2022 05:44

Use patched version of ember-cli-addon-docs with v2 addon support

5a04497

SergeAstapov force-pushed the v2-addon branch 2 times, most recently from 8498755 to be8be08 Compare March 11, 2022 03:41

Drop support for Ember 3.12

9538a37

SergeAstapov force-pushed the v2-addon branch from 8df5184 to 9538a37 Compare March 11, 2022 03:55

SergeAstapov mentioned this pull request Mar 11, 2022

Support v2 addon format ember-learn/ember-cli-addon-docs#1164

Merged

And link to ember-auto-import issue about multiple webpack chunks

b8b24e6

SergeAstapov commented Mar 11, 2022

View reviewed changes

SergeAstapov marked this pull request as ready for review March 11, 2022 04:32

SergeAstapov requested a review from ef4 March 11, 2022 04:32

SergeAstapov force-pushed the v2-addon branch from a5dbffa to 8d22082 Compare March 12, 2022 05:21

Update ember-animated-tools ref

0ff0a9b

SergeAstapov force-pushed the v2-addon branch from 8d22082 to 0ff0a9b Compare March 12, 2022 05:27

ef4 approved these changes Mar 16, 2022

View reviewed changes

SergeAstapov merged commit 6b66cad into master Mar 16, 2022

SergeAstapov deleted the v2-addon branch March 16, 2022 18:49

ctjhoa mentioned this pull request Aug 5, 2022

Converted samples NullVoxPopuli/ember-addon-migrator#32

Open

SergeAstapov mentioned this pull request Nov 15, 2023

Add 4.8 and 4.12 ember-try scenarios #624

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

V2 addon #397

V2 addon #397

SergeAstapov commented Mar 2, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

SergeAstapov Mar 11, 2022

ef4 left a comment

ef4 Mar 16, 2022

SergeAstapov Mar 16, 2022

ef4 Mar 16, 2022


		let origNow = clock.now;
		let origNow = getOrCreate('time-control', () => clock.now);

		@@ -38,11 +38,7 @@ let handlerCounter = 0;

		let BaseTaskProperty: { new (): HostObject };

		if (gte('3.10.0')) {

V2 addon #397

V2 addon #397

Conversation

SergeAstapov commented Mar 2, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ef4 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment