Bump some deps, update Ember to 3.28 (#923)

* Bump some deps

* ember-cli 3.28

* Bump some deps

* Bump ember-modal-dialog

* Fix lint

* Fix various things

* Remove debugger

* Fix some tests and deprecations

* Fix some computeds

* Fix some testing issues

* Back to params

* Use fork of render modifiers

* Use modal dialog fork

* Add macros

* Add embroider utils

* Remove embroider testing

Author: RobbieTheWagner

.eslintignore

@@ -13,6 +13,7 @@
 # misc
 /coverage/
 !.*
+.*/
 .eslintcache
 
 # ember-try

.eslintrc.js

@@ -45,24 +45,18 @@ module.exports = {
     // node files
     {
       files: [
-        '.eslintrc.js',
-        '.prettierrc.js',
-        '.template-lintrc.js',
-        'ember-cli-build.js',
-        'addon/styles/tailwind.js',
-        'index.js',
-        'testem.js',
-        'blueprints/*/index.js',
-        'config/**/*.js',
-        'lib/**/*.js',
-        'tests/dummy/config/**/*.js',
-        'tests-node/**/*.js',
-      ],
-      excludedFiles: [
-        'addon/**',
-        'addon-test-support/**',
-        'app/**',
-        'tests/dummy/app/**',
+        './.eslintrc.js',
+        './.prettierrc.js',
+        './.template-lintrc.js',
+        './ember-cli-build.js',
+        './index.js',
+        './testem.js',
+        './addon/styles/tailwind.js',
+        './blueprints/*/index.js',
+        './config/**/*.js',
+        './lib/**/*.js',
+        './tests/dummy/config/**/*.js',
+        './tests-node/**/*.js',
       ],
       parserOptions: {
         sourceType: 'script',
@@ -74,7 +68,6 @@ module.exports = {
       plugins: ['node'],
       extends: ['plugin:node/recommended'],
     },
-
     // node test files
     {
       globals: {
@@ -88,5 +81,10 @@ module.exports = {
         'node/no-unpublished-require': 'off',
       },
     },
+    {
+      // Test files:
+      files: ['tests/**/*-test.{js,ts}'],
+      extends: ['plugin:qunit/recommended'],
+    },
   ],
 };

.github/workflows/ci-cd.yml

@@ -123,14 +123,15 @@ jobs:
       fail-fast: true
       matrix:
         scenario:
-          - 'ember-lts-3.16'
           - 'ember-lts-3.20'
+          - 'ember-lts-3.24'
           - 'ember-release'
           - 'ember-beta'
           - 'ember-canary'
           - 'ember-default-with-jquery'
           - 'ember-classic'
-          - 'ember-concurrency-2.x'
+          # - 'embroider-safe'
+          # - 'embroider-optimized'
     timeout-minutes: 7
     steps:
       - name: Check out a copy of the repo

.npmignore

@@ -25,6 +25,7 @@
 /ember-cli-build.js
 /testem.js
 /tests/
+/yarn-error.log
 /yarn.lock
 .gitkeep
 

.prettierrc.js

@@ -2,4 +2,13 @@
 
 module.exports = {
   singleQuote: true,
+  overrides: [
+    {
+      files: '**/*.hbs',
+      options: {
+        parser: 'glimmer',
+        singleQuote: false,
+      },
+    },
+  ],
 };

README.md

@@ -9,9 +9,9 @@ ember-cli-addon-docs
 Compatibility
 ------------------------------------------------------------------------------
 
-* Ember.js v3.16 or above
-* Ember CLI v2.13 or above
-* Node.js v10 or above
+* Ember.js v3.20 or above
+* Ember CLI v3.20 or above
+* Node.js v12 or above
 
 **2/28/20 Update: AddonDocs is in Maintenace Mode.**
 

addon/components/api/x-component/template.hbs

@@ -9,7 +9,7 @@
       Show
     </panel.header>
 
-    {{#if hasToggles}}
+    {{#if this.hasToggles}}
       <Api::XToggles @toggles={{hash
           inherited=(if @component.hasInherited this.showInherited)
           internal=(if @component.hasInternal this.showInternal)
@@ -22,7 +22,7 @@
 {{/if}}
 
 
-{{#if hasContents}}
+{{#if this.hasContents}}
   <Api::XSections @sections={{hash
       constructors=this.constructors
       yields=this.yields

addon/components/api/x-import-path/component.js

@@ -8,14 +8,14 @@ export default Component.extend({
       <pre class="docs-md__code docs-whitespace-no-wrap">
         <span class="hljs-keyword">import</span>
 
-        {{#if (eq item.exportType "default")}}
-          {{item.name}}
+        {{#if (eq @item.exportType "default")}}
+          {{@item.name}}
         {{else}}
-        { {{item.name}} }
+        { {{@item.name}} }
         {{/if}}
 
         <span class="hljs-keyword">from</span>
-        <span class="hljs-string">'{{item.file}}'</span>;
+        <span class="hljs-string">'{{@item.file}}'</span>;
       </pre>
     </div>
   `,

addon/components/api/x-section/template.hbs

@@ -11,7 +11,7 @@
       </span>
     {{/if}}
 
-    {{#if (or @item.isClass item.isComponent)}}
+    {{#if (or @item.isClass @item.isComponent)}}
       <LinkTo @route="docs.api.item" @model={{concat "modules/" @item.id}} class="hover:underline">
         <strong>{{@item.name}}</strong>
       </LinkTo>

addon/components/api/x-sections/component.js

@@ -4,7 +4,7 @@ import Component from '@ember/component';
 export default Component.extend({
   tagName: '',
   layout: hbs`
-    {{#each-in sections as |sectionName items|}}
+    {{#each-in @sections as |sectionName items|}}
       {{#if items}}
         <section data-test-api-section class="item-section">
           <h2 data-test-section-header={{sectionName}} class="docs-h2">

addon/components/docs-code-highlight/component.js

@@ -1,4 +1,3 @@
-import classic from 'ember-classic-decorator';
 import {
   classNameBindings,
   tagName,
@@ -33,7 +32,6 @@ hljs.registerLanguage('sh', shell);
 hljs.registerLanguage('typescript', typescript);
 hljs.registerLanguage('ts', typescript);
 
-@classic
 @tagName('pre')
 @classNameBindings('language')
 @templateLayout(layout)

addon/components/docs-demo/component.js

@@ -1,4 +1,3 @@
-import classic from 'ember-classic-decorator';
 import { tagName, layout as templateLayout } from '@ember-decorators/component';
 import { action, computed } from '@ember/object';
 import { A } from '@ember/array';
@@ -29,10 +28,11 @@ import layout from './template';
   @yield {Component} demo.snippet
   @yield {Component} demo.liveExample
 */
-@classic
+
 @templateLayout(layout)
 @tagName('')
 export default class DocsDemo extends Component {
+  // eslint-disable-next-line ember/classic-decorator-hooks
   init() {
     super.init(...arguments);
 

addon/components/docs-demo/x-example/component.js

@@ -1,15 +1,14 @@
-import classic from 'ember-classic-decorator';
 import {
   classNames,
   layout as templateLayout,
 } from '@ember-decorators/component';
 import Component from '@ember/component';
 import layout from './template';
 
-@classic
 @templateLayout(layout)
 @classNames('docs-p-4')
 export default class XExample extends Component {
+  // eslint-disable-next-line ember/classic-decorator-hooks
   init() {
     super.init(...arguments);
     this.set('elementId', 'example-' + this.name);

addon/components/docs-header/search-result/template.hbs

@@ -1,14 +1,21 @@
-<div {{on "click" this.onClick}} {{on "mouseenter" this.onMouseEnter}}>
-  {{#link-to
-    params=this.linkArgs
-    class=(concat
-      "docs-block docs-py-2 docs-px-3 docs-text-black docs-no-underline hover:docs-bg-grey-lighter "
-      (if @selected "docs-bg-grey-lighter")
-    )
-  }}
-    <div class="docs-flex docs-items-center">
-      {{svg-jar this.icon height=28 width=28 class="docs-mr-2 docs-flex-no-shrink"}}
-      <span class="docs-truncate">
+{{! template-lint-disable no-unknown-arguments-for-builtin-components }}
+<div {{on 'click' this.onClick}} {{on 'mouseenter' this.onMouseEnter}}>
+  <LinkTo
+    class={{
+      concat
+      'docs-block docs-py-2 docs-px-3 docs-text-black docs-no-underline hover:docs-bg-grey-lighter '
+      (if @selected 'docs-bg-grey-lighter')
+    }}
+    @params={{this.linkArgs}}
+  >
+    <div class='docs-flex docs-items-center'>
+      {{svg-jar
+        this.icon
+        height=28
+        width=28
+        class='docs-mr-2 docs-flex-no-shrink'
+      }}
+      <span class='docs-truncate'>
         {{#if this.titleMatchesQuery}}
           {{{this.highlightedTitle}}}
         {{else}}
@@ -18,9 +25,9 @@
     </div>
 
     {{#if (not this.titleMatchesQuery)}}
-      <small class="docs-text-grey-dark docs-inline-block">
+      <small class='docs-text-grey-dark docs-inline-block'>
         {{{this.bestMatch}}}
       </small>
     {{/if}}
-  {{/link-to}}
-</div>
+  </LinkTo>
+</div>

addon/components/docs-header/version-selector/component.js

@@ -2,35 +2,27 @@ import Component from '@ember/component';
 import { inject as service } from '@ember/service';
 import layout from './template';
 import { reads } from '@ember/object/computed';
-// import config from 'ember-get-config';
 import { computed } from '@ember/object';
 import { A } from '@ember/array';
 import { getOwner } from '@ember/application';
 
 // const { latestVersionName, primaryBranch } = config['ember-cli-addon-docs'];
 //
 export default Component.extend({
-  layout,
-
-  latestVersionName: computed(function () {
-    let config =
-      getOwner(this).resolveRegistration('config:environment')[
-        'ember-cli-addon-docs'
-      ];
+  projectVersion: service(),
 
-    return config.latestVersionName;
-  }),
+  layout,
 
-  primaryBranch: computed(function () {
-    let config =
+  init() {
+    this._super(...arguments);
+    const config =
       getOwner(this).resolveRegistration('config:environment')[
         'ember-cli-addon-docs'
       ];
+    this.set('latestVersionName', config.latestVersionName);
+    this.set('primaryBranch', config.primaryBranch);
+  },
 
-    return config.primaryBranch;
-  }),
-
-  projectVersion: service(),
   'on-close'() {},
 
   currentVersion: reads('projectVersion.currentVersion'),

addon/components/docs-link/component.js

@@ -1,17 +1,15 @@
-import classic from 'ember-classic-decorator';
 import { classNames } from '@ember-decorators/component';
 import LinkComponent from '@ember/routing/link-component';
 
 /**
   Just a styled subclass of LinkComponent. Comes in handy when rending links in Markdown templates:
 
   ```md
-  Here I am, telling you about {{docs-link 'another page' 'docs.x-foo'}}
+  Here I am, telling you about <DocsLink @route="docs.x-foo">another page</DocsLink>
   ```
 
   @class DocsLink
   @public
 */
-@classic
 @classNames('docs-md__a')
 export default class DocsLink extends LinkComponent {}

addon/components/docs-logo/component.js

@@ -1,4 +1,3 @@
-import classic from 'ember-classic-decorator';
 import { tagName, layout as templateLayout } from '@ember-decorators/component';
 import { equal } from '@ember/object/computed';
 import { assert } from '@ember/debug';
@@ -11,7 +10,7 @@ import layout from './template';
   @class DocsLogo
   @public
 */
-@classic
+
 @templateLayout(layout)
 @tagName('')
 export default class DocsLogo extends Component {
@@ -29,6 +28,15 @@ export default class DocsLogo extends Component {
   */
   logo = 'ember';
 
+  @equal('logo', 'ember')
+  showEmber;
+
+  @equal('logo', 'ember-cli')
+  showEmberCli;
+
+  @equal('logo', 'ember-data')
+  showEmberData;
+
   didReceiveAttrs() {
     super.didReceiveAttrs(...arguments);
 
@@ -39,13 +47,4 @@ export default class DocsLogo extends Component {
       validLogos.includes(logo)
     );
   }
-
-  @equal('logo', 'ember')
-  showEmber;
-
-  @equal('logo', 'ember-cli')
-  showEmberCli;
-
-  @equal('logo', 'ember-data')
-  showEmberData;
 }

addon/components/docs-snippet/component.js

@@ -1,4 +1,3 @@
-import classic from 'ember-classic-decorator';
 import { tagName, layout as templateLayout } from '@ember-decorators/component';
 import Component from '@ember/component';
 import layout from './template';
@@ -13,7 +12,7 @@ import layout from './template';
   @class DocsSnippet
   @public
 */
-@classic
+
 @tagName('')
 @templateLayout(layout)
 export default class DocsSnippet extends Component {

addon/components/docs-snippet/template.hbs

@@ -30,6 +30,6 @@
       </CopyButton>
     {{/if}}
 
-    <DocsCodeHighlight @language={{language}}>{{snippet.source}}</DocsCodeHighlight>
+    <DocsCodeHighlight @language={{@language}}>{{snippet.source}}</DocsCodeHighlight>
   {{/let}}
 </div>