Upgrade EmberJS to Octane

Re-Build Ember example
tastejs · Apr 19, 2020 · beff649 · beff649
1 parent 41ba86d
commit beff649
Show file tree

Hide file tree

Showing 82 changed files with 15,053 additions and 14,740 deletions.
diff --git a/.travis.yml b/.travis.yml
@@ -119,6 +119,10 @@ jobs:
       env:
         - CYPRESS_framework=emberjs
       <<: *defaults
+    - stage: test
+      env:
+        - CYPRESS_framework=emberjs-octane
+      <<: *defaults
     - stage: test
       env:
         - CYPRESS_framework=enyo_backbone

diff --git a/examples/emberjs/README.md b/examples/emberjs/README.md
@@ -1,9 +1,9 @@
-# Ember.js TodoMVC Example using Ember CLI v3.2
+# Ember.js Octane TodoMVC Example using Ember CLI v3.16
 
 > A framework for creating ambitious web applications.
 
 > _[Ember.js - emberjs.com](http://emberjs.com)_
-> _[Ember CLI - ember-cli.com](http://ember-cli.com)_
+> _[Ember CLI - ember-cli.com](http://cli.emberjs.com)_
 
 ## Note for people updating this app.
 
@@ -13,8 +13,8 @@ You can develop this project as a standard Ember CLI application:
 
 ```bash
 $ cd todomvc
-$ npm install
-$ ember server
+$ yarn
+$ yarn start
 ```
 
 Update to the latest Ember with `ember-cli-update` and with the latest codemods:
@@ -30,21 +30,17 @@ $ git commit -m 'Update TodoMVC with codemods' -a
 Build Ember TodoMVC for production:
 
 ```bash
-$ ember build --prod
+$ yarn ember build --prod
 ```
 
 Run Cypress Test:
 
 ```bash
 # Run this command from the root folder of this repository
-$ npm install
-$ npm run server
+$ yarn
+$ yarn server
 
 # Run in a separated terminal
-$ CYPRESS_framework=emberjs npm run cy:open
+$ yarn cypress open --env framework=emberjs-octane
 ```
 
-### Ember Notes
-
-* The `rootURL` param in `config/environment.js` should keep as empty string.
-
diff --git a/examples/emberjs/assets b/examples/emberjs/assets
diff --git a/...s/emberjs/todomvc/app/components/.gitkeep → ...tboot-d41d8cd98f00b204e9800998ecf8427e.js b/...s/emberjs/todomvc/app/components/.gitkeep → ...tboot-d41d8cd98f00b204e9800998ecf8427e.js
diff --git a/examples/emberjs/assets/todomvc-43b6e3250bad06f4f6525c3f76cdccb4.js b/examples/emberjs/assets/todomvc-43b6e3250bad06f4f6525c3f76cdccb4.js
diff --git a/...omvc-d41d8cd98f00b204e9800998ecf8427e.css → ...omvc-d41d8cd98f00b204e9800998ecf8427e.css b/...omvc-d41d8cd98f00b204e9800998ecf8427e.css → ...omvc-d41d8cd98f00b204e9800998ecf8427e.css
diff --git a/examples/emberjs/assets/vendor-140a551a2eaeeade2a766e8a028544c0.js b/examples/emberjs/assets/vendor-140a551a2eaeeade2a766e8a028544c0.js
diff --git a/examples/emberjs/assets/vendor-3fc42c724882a4e06060d5610a02581a.css b/examples/emberjs/assets/vendor-3fc42c724882a4e06060d5610a02581a.css
diff --git a/examples/emberjs/index.html b/examples/emberjs/index.html
diff --git a/examples/emberjs/index.html b/examples/emberjs/index.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>TodoMVC</title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+
+<meta name="todomvc/config/environment" content="%7B%22modulePrefix%22%3A%22todomvc%22%2C%22environment%22%3A%22production%22%2C%22rootURL%22%3A%22%2Fexamples%2Femberjs-octane%2F%22%2C%22locationType%22%3A%22auto%22%2C%22EmberENV%22%3A%7B%22FEATURES%22%3A%7B%7D%2C%22EXTEND_PROTOTYPES%22%3Afalse%2C%22_APPLICATION_TEMPLATE_WRAPPER%22%3Afalse%2C%22_DEFAULT_ASYNC_OBSERVERS%22%3Atrue%2C%22_JQUERY_INTEGRATION%22%3Afalse%2C%22_TEMPLATE_ONLY_GLIMMER_COMPONENTS%22%3Atrue%7D%2C%22APP%22%3A%7B%22name%22%3A%22todomvc%22%2C%22version%22%3A%220.0.0%2Ba6780c37%22%7D%2C%22exportApplicationGlobal%22%3Afalse%7D" />
+
+    <link integrity="" rel="stylesheet" href="/examples/emberjs-octane/assets/vendor-3fc42c724882a4e06060d5610a02581a.css">
+    <link integrity="" rel="stylesheet" href="/examples/emberjs-octane/assets/todomvc-d41d8cd98f00b204e9800998ecf8427e.css">
+
+
+  </head>
+  <body>
+
+
+    <script src="/examples/emberjs-octane/assets/vendor-140a551a2eaeeade2a766e8a028544c0.js"></script>
+    <script src="/examples/emberjs-octane/assets/todomvc-43b6e3250bad06f4f6525c3f76cdccb4.js"></script>
+
+
+  </body>
+</html>
diff --git a/examples/emberjs/re-build.sh b/examples/emberjs/re-build.sh
@@ -0,0 +1,6 @@
+#!/bin/bash
+
+( cd todomvc && yarn build:prod ) \
+&& rm -rf assets index.html \
+&& ln -s todomvc/dist/assets assets \
+&& ln -s todomvc/dist/index.html index.html
diff --git a/examples/emberjs/todomvc/.eslintignore b/examples/emberjs/todomvc/.eslintignore
@@ -8,9 +8,11 @@
 
 # dependencies
 /bower_components/
+/node_modules/
 
 # misc
 /coverage/
+!.*
 
 # ember-try
 /.node_modules.ember-try/

diff --git a/examples/emberjs/todomvc/.eslintrc.js b/examples/emberjs/todomvc/.eslintrc.js
@@ -1,8 +1,12 @@
 module.exports = {
   root: true,
+  parser: 'babel-eslint',
   parserOptions: {
-    ecmaVersion: 2017,
-    sourceType: 'module'
+    ecmaVersion: 2018,
+    sourceType: 'module',
+    ecmaFeatures: {
+      legacyDecorators: true
+    }
   },
   plugins: [
     'ember'
@@ -15,26 +19,36 @@ module.exports = {
     browser: true
   },
   rules: {
+    'ember/no-jquery': 'error'
   },
   overrides: [
     // node files
     {
       files: [
+        '.eslintrc.js',
         '.template-lintrc.js',
         'ember-cli-build.js',
         'testem.js',
         'blueprints/*/index.js',
         'config/**/*.js',
-        'lib/*/index.js'
+        'lib/*/index.js',
+        'server/**/*.js'
       ],
       parserOptions: {
-        sourceType: 'script',
-        ecmaVersion: 2015
+        sourceType: 'script'
       },
       env: {
         browser: false,
         node: true
-      }
+      },
+      plugins: ['node'],
+      rules: Object.assign({}, require('eslint-plugin-node').configs.recommended.rules, {
+        // add your custom rules and overrides for node files here
+
+        // this can be removed once the following is fixed
+        // https://github.com/mysticatea/eslint-plugin-node/issues/77
+        'node/no-unpublished-require': 'off'
+      })
     }
   ]
 };
diff --git a/examples/emberjs/todomvc/.gitignore b/examples/emberjs/todomvc/.gitignore
@@ -1,14 +1,16 @@
 # See https://help.github.com/ignore-files/ for more about ignoring files.
 
 # compiled output
-# /dist/
+/dist/
 /tmp/
 
 # dependencies
 /bower_components/
 /node_modules/
 
 # misc
+/.env*
+/.pnp*
 /.sass-cache
 /connect.lock
 /coverage/

diff --git a/examples/emberjs/todomvc/.template-lintrc.js b/examples/emberjs/todomvc/.template-lintrc.js
@@ -1,5 +1,5 @@
 'use strict';
 
 module.exports = {
-  extends: 'recommended'
+  extends: 'octane'
 };
diff --git a/examples/emberjs/todomvc/.travis.yml b/examples/emberjs/todomvc/.travis.yml
@@ -1,7 +1,7 @@
 ---
 language: node_js
 node_js:
-  - "6"
+  - "8"
 
 sudo: false
 dist: trusty
@@ -10,18 +10,25 @@ addons:
   chrome: stable
 
 cache:
-  directories:
-    - $HOME/.npm
+  yarn: true
 
 env:
   global:
     # See https://git.io/vdao3 for details.
     - JOBS=1
 
+branches:
+  only:
+    - master
+
 before_install:
-  - npm config set spin false
+  - curl -o- -L https://yarnpkg.com/install.sh | bash
+  - export PATH=$HOME/.yarn/bin:$PATH
+
+install:
+  - yarn install --non-interactive
 
 script:
-  - npm run lint:hbs
-  - npm run lint:js
-  - npm test
+  - yarn lint:hbs
+  - yarn lint:js
+  - yarn test
diff --git a/examples/emberjs/todomvc/README.md b/examples/emberjs/todomvc/README.md
@@ -0,0 +1,58 @@
+# todomvc
+
+This README outlines the details of collaborating on this Ember application.
+A short introduction of this app could easily go here.
+
+## Prerequisites
+
+You will need the following things properly installed on your computer.
+
+* [Git](https://git-scm.com/)
+* [Node.js](https://nodejs.org/)
+* [Yarn](https://yarnpkg.com/)
+* [Ember CLI](https://ember-cli.com/)
+* [Google Chrome](https://google.com/chrome/)
+
+## Installation
+
+* `git clone <repository-url>` this repository
+* `cd todomvc`
+* `yarn install`
+
+## Running / Development
+
+* `ember serve`
+* Visit your app at [http://localhost:4200](http://localhost:4200).
+* Visit your tests at [http://localhost:4200/tests](http://localhost:4200/tests).
+
+### Code Generators
+
+Make use of the many generators for code, try `ember help generate` for more details
+
+### Running Tests
+
+* `ember test`
+* `ember test --server`
+
+### Linting
+
+* `yarn lint:hbs`
+* `yarn lint:js`
+* `yarn lint:js --fix`
+
+### Building
+
+* `ember build` (development)
+* `ember build --environment production` (production)
+
+### Deploying
+
+Specify what it takes to deploy your app.
+
+## Further Reading / Useful Links
+
+* [ember.js](https://emberjs.com/)
+* [ember-cli](https://ember-cli.com/)
+* Development Browser Extensions
+  * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
+  * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)
diff --git a/examples/emberjs/todomvc/app/app.js b/examples/emberjs/todomvc/app/app.js
@@ -1,14 +1,12 @@
 import Application from '@ember/application';
-import Resolver from './resolver';
+import Resolver from 'ember-resolver';
 import loadInitializers from 'ember-load-initializers';
 import config from './config/environment';
 
-const App = Application.extend({
-  modulePrefix: config.modulePrefix,
-  podModulePrefix: config.podModulePrefix,
-  Resolver
-});
+export default class App extends Application {
+  modulePrefix = config.modulePrefix;
+  podModulePrefix = config.podModulePrefix;
+  Resolver = Resolver;
+}
 
 loadInitializers(App, config.modulePrefix);
-
-export default App;
diff --git a/examples/emberjs/todomvc/app/components/author-attribution.hbs b/examples/emberjs/todomvc/app/components/author-attribution.hbs
@@ -0,0 +1,9 @@
+<ExternalLink href='https://github.com/{{@github}}'>
+  {{@name}}
+</ExternalLink>
+{{#if @twitter}}
+  &nbsp;-&nbsp;
+  <ExternalLink href='https://twitter.com/{{@twitter}}'>
+    @{{@twitter}}
+  </ExternalLink>
+  {{/if}}
diff --git a/examples/emberjs/todomvc/app/components/external-link.hbs b/examples/emberjs/todomvc/app/components/external-link.hbs
@@ -0,0 +1,3 @@
+<a href='' target='_blank' rel='noopener noreferrer' ...attributes>
+  {{yield}}
+</a>
diff --git a/examples/emberjs/todomvc/app/components/footer.hbs b/examples/emberjs/todomvc/app/components/footer.hbs
@@ -0,0 +1,10 @@
+<footer class='info'>
+  <p>Double-click to edit a todo</p>
+  <p>
+    Created by
+    <AuthorAttribution @name='Preston Sego' @github='NullVoxPopuli' @twitter='NullVoxPopuli' />,
+    <AuthorAttribution @name='Miguel Camba' @github='cibernox' />,
+    <AuthorAttribution @name='Addy Osmani'  @github='addyosmani' @twitter='addyosmani' />
+  </p>
+  <p>Part of <ExternalLink href='http://todomvc.com'>TodoMVC</ExternalLink></p>
+</footer>
diff --git a/examples/emberjs/todomvc/app/components/todo-app.hbs b/examples/emberjs/todomvc/app/components/todo-app.hbs
@@ -0,0 +1,7 @@
+<section class='todoapp'>
+
+  <TodoApp::Header />
+
+  {{yield}}
+
+</section>
diff --git a/examples/emberjs/todomvc/app/components/todo-app/footer.hbs b/examples/emberjs/todomvc/app/components/todo-app/footer.hbs
@@ -0,0 +1,27 @@
+{{#if this.todoData.all}}
+  <footer class='footer'>
+
+    <span class='todo-count'>
+      <strong>{{this.remaining}}</strong> {{this.suffix}} left
+    </span>
+
+    <ul class='filters'>
+      <li>
+        <LinkTo @route='index' @activeClass='selected'>All</LinkTo>
+        <LinkTo @route='active' @activeClass='selected'>Active</LinkTo>
+        <LinkTo @route='completed' @activeClass='selected'>Completed</LinkTo>
+      </li>
+    </ul>
+
+    {{#if this.completed}}
+      <button
+        type='button'
+        class='clear-completed'
+        {{on 'click' this.todoData.clearCompleted}}
+      >
+        Clear completed
+      </button>
+    {{/if}}
+
+  </footer>
+{{/if}}