Fix CI (#773)

* remove legacy ember-decorators * use ember-qunit instead of ember-cli-qunit * Remove ember-legacy-class-shim docs: https://github.com/pzuraq/ember-legacy-class-shim We no longer have ES6 classes inside this addon, so we don't need the shim * Skip column reordering tests on ember release, beta, canary See: #775 * Add note that async observers are needed for Ember 3.13+ * Update README to point out Ember 3.13 regressions
Addepar · Oct 29, 2019 · 8673471 · 8673471
1 parent c2c1ea3
commit 8673471
Show file tree

Hide file tree

Showing 28 changed files with 774 additions and 731 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,14 +1,6 @@
 module.exports = {
   extends: ['@addepar', '@addepar/eslint-config/ember'],
   parser: 'babel-eslint',
-  parserOptions: {
-    ecmaFeatures: {
-      legacyDecorators: true,
-    },
-  },
-  env: {
-    es6: true,
-  },
   rules: {
     'no-restricted-globals': 'off',
 

diff --git a/README.md b/README.md
@@ -30,7 +30,17 @@ Documentation is available at: https://opensource.addepar.com/ember-table/docs
 Ember Table uses [ember-cli-addon-docs](https://github.com/ember-learn/ember-cli-addon-docs) for its documentation.
 To run the docs locally, clone the repo, run `yarn && yarn start` and then navigate to `http://localhost:4200/docs`.
 
-## Usage.
+## Known Issues with Ember 3.13+
+
+Ember 3.13 shipped with a change to the internal property change tracking system, which has
+caused a few issues with Ember Table:
+
+  * Issue [#775](https://github.com/Addepar/ember-table/issues/775): Column reordering is very slow (due to many sync observers firing). Workaround: Opt in to async observers.
+  * Issue [#776](https://github.com/Addepar/ember-table/issues/776): Column definitions that are plain JavaScript arrays will not reorder. Workaround: Wrap column definitions in `Ember.A()`
+
+New issues that arise will be given the [ember-3.13 label](https://github.com/Addepar/ember-table/labels/ember-3.13).
+
+## Usage
 
 To use `Ember Table`, you need to create `columns` and `rows` dataset.
 

diff --git a/config/ember-try.js b/config/ember-try.js
@@ -167,6 +167,9 @@ module.exports = function() {
         },
         {
           name: 'ember-release',
+          env: {
+            SKIP_REORDERING_TESTS: true,
+          },
           npm: {
             devDependencies: {
               'ember-source': urls[0],
@@ -176,6 +179,9 @@ module.exports = function() {
         },
         {
           name: 'ember-beta',
+          env: {
+            SKIP_REORDERING_TESTS: true,
+          },
           npm: {
             devDependencies: {
               'ember-source': urls[1],
@@ -185,6 +191,9 @@ module.exports = function() {
         },
         {
           name: 'ember-canary',
+          env: {
+            SKIP_REORDERING_TESTS: true,
+          },
           npm: {
             devDependencies: {
               'ember-source': urls[2],

diff --git a/ember-cli-build.js b/ember-cli-build.js
@@ -8,7 +8,7 @@ module.exports = function(defaults) {
       includePolyfill: true,
     },
     babel: {
-      plugins: ['transform-object-rest-spread'],
+      plugins: ['@babel/plugin-proposal-object-rest-spread'],
     },
     'ember-faker': {
       enabled: true, // Always enable for dummy app because the docs examples use faker

diff --git a/package.json b/package.json
@@ -25,21 +25,19 @@
     "docs:deploy": "ember deploy production"
   },
   "dependencies": {
-    "@ember-decorators/babel-transforms": "^0.1.1",
     "@html-next/vertical-collection": "^1.0.0-beta.14",
     "broccoli-string-replace": "^0.1.2",
     "css-element-queries": "^0.4.0",
     "ember-assign-polyfill": "^2.2.0",
     "ember-classy-page-object": "^0.6.1",
-    "ember-cli-babel": "^6.7.1",
+    "ember-cli-babel": "^7.12.0",
     "ember-cli-htmlbars": "^3.0.1",
     "ember-cli-htmlbars-inline-precompile": "^2.1.0",
     "ember-cli-node-assets": "^0.2.2",
     "ember-cli-sass": "^7.0.0",
     "ember-cli-version-checker": "^3.0.1",
     "ember-compatibility-helpers": "^1.2.0",
     "ember-getowner-polyfill": "^2.2.0",
-    "ember-legacy-class-shim": "^1.0.0",
     "ember-raf-scheduler": "^0.1.0",
     "ember-test-selectors": "^0.3.9",
     "ember-useragent": "^0.6.0",
@@ -51,9 +49,9 @@
     "@addepar/prettier-config": "^1.0.0",
     "@addepar/sass-lint-config": "^2.0.1",
     "@addepar/style-toolbox": "~0.7.0",
+    "@babel/plugin-proposal-object-rest-spread": "^7.6.2",
     "@types/ember": "^2.8.22",
     "babel-eslint": "^10.0.1",
-    "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "broccoli-asset-rev": "^3.0.0",
     "ember-a11y-testing": "^0.5.0",
     "ember-ajax": "^4.0.2",
@@ -68,12 +66,10 @@
     "ember-cli-deploy-git-ci": "^1.0.1",
     "ember-cli-eslint": "^5.1.0",
     "ember-cli-inject-live-reload": "^2.0.1",
-    "ember-cli-qunit": "^4.1.1",
     "ember-cli-shims": "^1.2.0",
     "ember-cli-sri": "^2.1.0",
     "ember-cli-uglify": "^2.0.0",
     "ember-debug-handlers-polyfill": "^1.1.1",
-    "ember-decorators": "^2.2.0",
     "ember-disable-prototype-extensions": "^1.1.2",
     "ember-export-application-global": "^2.0.0",
     "ember-faker": "^1.5.0",
@@ -82,9 +78,10 @@
     "ember-math-helpers": "^2.10.0",
     "ember-maybe-import-regenerator": "^0.1.6",
     "ember-native-dom-helpers": "0.6.2",
+    "ember-qunit": "^4.5.1",
     "ember-radio-button": "^1.2.3",
     "ember-resolver": "^5.1.1",
-    "ember-source": "~3.1.0",
+    "ember-source": "~3.12",
     "ember-source-channel-url": "^1.0.1",
     "ember-truth-helpers": "^2.0.0",
     "ember-try": "^1.1.0",

diff --git a/tests/dummy/app/pods/application/controller.js b/tests/dummy/app/pods/application/controller.js
@@ -1,11 +1,9 @@
 import Controller from '@ember/controller';
-
-import { computed } from '@ember-decorators/object';
 import { gte } from 'ember-compatibility-helpers';
+import { computed } from '@ember/object';
 
-export default class ApplicationController extends Controller {
-  @computed
-  get canShowAddonDocs() {
+export default Controller.extend({
+  canShowAddonDocs: computed(function() {
     return gte('2.8.0');
-  }
-}
+  }),
+});
diff --git a/tests/dummy/app/pods/components/custom-row/component.js b/tests/dummy/app/pods/components/custom-row/component.js
@@ -1,5 +1,5 @@
 import EmberTableRow from '../../../components/ember-tr';
-import { classNames } from '@ember-decorators/component';
 
-@classNames('custom-row')
-export default class CustomRow extends EmberTableRow {}
+export default EmberTableRow.extend({
+  classNames: ['custom-row'],
+});
diff --git a/tests/dummy/app/pods/docs/guides/body/occlusion/controller.js b/tests/dummy/app/pods/docs/guides/body/occlusion/controller.js
@@ -1,20 +1,18 @@
 import Controller from '@ember/controller';
-import { computed } from '@ember-decorators/object';
+import { computed } from '@ember/object';
 
-export default class SimpleController extends Controller {
+export default Controller.extend({
   // BEGIN-SNIPPET docs-example-occlusion.js
-  @computed
-  get columns() {
+  columns: computed(function() {
     return [
       { name: 'A', valuePath: 'A', width: 180 },
       { name: 'B', valuePath: 'B', width: 180 },
       { name: 'C', valuePath: 'C', width: 180 },
       { name: 'D', valuePath: 'D', width: 180 },
     ];
-  }
+  }),
 
-  @computed
-  get rows() {
+  rows: computed(function() {
     return [
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
@@ -28,6 +26,6 @@ export default class SimpleController extends Controller {
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
     ];
-  }
+  }),
   // END-SNIPPET
-}
+});
diff --git a/tests/dummy/app/pods/docs/guides/body/row-selection/controller.js b/tests/dummy/app/pods/docs/guides/body/row-selection/controller.js
@@ -1,20 +1,18 @@
 import Controller from '@ember/controller';
-import { computed } from '@ember-decorators/object';
+import { computed } from '@ember/object';
 
-export default class SimpleController extends Controller {
+export default Controller.extend({
   // BEGIN-SNIPPET docs-example-row-selection.js
-  @computed
-  get columns() {
+  columns: computed(function() {
     return [
       { name: 'A', valuePath: 'A', width: 180 },
       { name: 'B', valuePath: 'B', width: 180 },
       { name: 'C', valuePath: 'C', width: 180 },
       { name: 'D', valuePath: 'D', width: 180 },
     ];
-  }
+  }),
 
-  @computed
-  get rows() {
+  rows: computed(function() {
     return [
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
@@ -28,20 +26,19 @@ export default class SimpleController extends Controller {
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
     ];
-  }
+  }),
   // END-SNIPPET
 
   // BEGIN-SNIPPET docs-example-selected-rows.js
-  constructor() {
-    super(...arguments);
+  init() {
+    this._super(...arguments);
 
     let [rowWithChildren] = this.get('rowWithChildren');
 
     this.preselection = [rowWithChildren];
-  }
+  },
 
-  @computed
-  get rowWithChildren() {
+  rowWithChildren: computed(function() {
     return [
       {
         A: 'A',
@@ -65,16 +62,15 @@ export default class SimpleController extends Controller {
         ],
       },
     ];
-  }
+  }),
   // END-SNIPPET
 
   // BEGIN-SNIPPET docs-example-selection-modes.js
-  rowSelectionMode = 'multiple';
-  checkboxSelectionMode = 'multiple';
-  selectingChildrenSelectsParent = true;
+  rowSelectionMode: 'multiple',
+  checkboxSelectionMode: 'multiple',
+  selectingChildrenSelectsParent: true,
 
-  @computed
-  get rowsWithChildren() {
+  rowsWithChildren: computed(function() {
     let makeRow = (id, { children } = { children: [] }) => {
       return {
         A: `A${id}`,
@@ -98,10 +94,9 @@ export default class SimpleController extends Controller {
         ],
       }),
     ];
-  }
+  }),
 
-  @computed('demoSelection')
-  get currentSelection() {
+  currentSelection: computed('demoSelection', function() {
     let selection = this.demoSelection;
     if (!selection || selection.length === 0) {
       return 'Nothing selected';
@@ -113,6 +108,6 @@ export default class SimpleController extends Controller {
         return `Single: ${row.A}`;
       }
     }
-  }
+  }),
   // END-SNIPPET
-}
+});
diff --git a/tests/dummy/app/pods/docs/guides/body/rows-and-trees/controller.js b/tests/dummy/app/pods/docs/guides/body/rows-and-trees/controller.js
@@ -1,20 +1,18 @@
 import Controller from '@ember/controller';
-import { computed } from '@ember-decorators/object';
+import { computed } from '@ember/object';
 
-export default class SimpleController extends Controller {
+export default Controller.extend({
   // BEGIN-SNIPPET docs-example-rows.js
-  @computed
-  get columns() {
+  columns: computed(function() {
     return [
       { name: 'A', valuePath: 'A', width: 180 },
       { name: 'B', valuePath: 'B', width: 180 },
       { name: 'C', valuePath: 'C', width: 180 },
       { name: 'D', valuePath: 'D', width: 180 },
     ];
-  }
+  }),
 
-  @computed
-  get rows() {
+  rows: computed(function() {
     return [
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
@@ -28,14 +26,13 @@ export default class SimpleController extends Controller {
       { A: 'A', B: 'B', C: 'C', D: 'D' },
       { A: 'A', B: 'B', C: 'C', D: 'D' },
     ];
-  }
+  }),
   // END-SNIPPET
 
   // BEGIN-SNIPPET docs-example-tree-rows.js
-  treeEnabled = true;
+  treeEnabled: true,
 
-  @computed
-  get rowsWithChildren() {
+  rowsWithChildren: computed(function() {
     return [
       {
         A: 'A',
@@ -74,14 +71,13 @@ export default class SimpleController extends Controller {
         ],
       },
     ];
-  }
+  }),
   // END-SNIPPET
 
   // BEGIN-SNIPPET docs-example-rows-with-collapse.js
-  collapseEnabled = true;
+  collapseEnabled: true,
 
-  @computed
-  get rowsWithCollapse() {
+  rowsWithCollapse: computed(function() {
     return [
       {
         A: 'A',
@@ -123,6 +119,6 @@ export default class SimpleController extends Controller {
         ],
       },
     ];
-  }
+  }),
   // END-SNIPPET
-}
+});