upgrade to 3.0 (#95)

.eslintrc.js

@@ -25,7 +25,8 @@ module.exports = {
       files: [
         'testem.js',
         'ember-cli-build.js',
-        'config/**/*.js'
+        'config/**/*.js',
+        'lib/*/index.js'
       ],
       parserOptions: {
         sourceType: 'script',
@@ -35,15 +36,6 @@ module.exports = {
         browser: false,
         node: true
       }
-    },
-
-    // test files
-    {
-      files: ['tests/**/*.js'],
-      excludedFiles: ['tests/dummy/**/*.js'],
-      env: {
-        embertest: true
-      }
     }
   ]
 };

README.md

@@ -36,6 +36,11 @@ Make use of the many generators for code, try `ember help generate` for more det
 * `ember test`
 * `ember test --server`
 
+### Linting
+
+* `npm run lint:js`
+* `npm run lint:js -- --fix`
+
 ### Building
 
 * `ember build` (development)

app/templates/application.hbs

@@ -6,10 +6,10 @@
       </h1>
     {{/link-to}}
     <div class="links">
-      {{#link-to 'about'}}
+      {{#link-to 'about' class="menu-about"}}
         About
       {{/link-to}}
-      {{#link-to 'contact'}}
+      {{#link-to 'contact' class="menu-contact"}}
         Contact
       {{/link-to}}
     </div>
@@ -18,4 +18,3 @@
     {{outlet}}
   </div>
 </div>
-

app/templates/components/rental-listing.hbs

@@ -3,7 +3,7 @@
     <img src="{{rental.image}}" alt="">
     <small>View Larger</small>
   </a>
-  <h3>{{link-to rental.title "rentals.show" rental}}</h3>
+  <h3>{{link-to rental.title "rentals.show" rental class=rental.id}}</h3>
   <div class="detail owner">
     <span>Owner:</span> {{rental.owner}}
   </div>

config/targets.js

@@ -1,8 +1,16 @@
+const browsers = [
+  'last 1 Chrome versions',
+  'last 1 Firefox versions',
+  'last 1 Safari versions'
+];
+
+const isCI = !!process.env.CI;
+const isProduction = process.env.EMBER_ENV === 'production';
+
+if (isCI || isProduction) {
+  browsers.push('ie 11');
+}
+
 module.exports = {
-  browsers: [
-    'ie 9',
-    'last 1 Chrome versions',
-    'last 1 Firefox versions',
-    'last 1 Safari versions'
-  ]
+  browsers
 };

package.json

@@ -19,7 +19,7 @@
   "devDependencies": {
     "broccoli-asset-rev": "^2.4.5",
     "ember-ajax": "^3.0.0",
-    "ember-cli": "~2.18.0",
+    "ember-cli": "~3.0.0",
     "ember-cli-app-version": "^3.0.0",
     "ember-cli-babel": "^6.6.0",
     "ember-cli-dependency-checker": "^2.0.0",
@@ -33,13 +33,14 @@
     "ember-cli-sri": "^2.1.0",
     "ember-cli-tutorial-style": "^2.0.0",
     "ember-cli-uglify": "^2.0.0",
-    "ember-cli-update": "^0.10.1",
-    "ember-data": "~2.18.0",
+    "ember-cli-update": "^0.14.0",
+    "ember-data": "~3.0.0",
     "ember-export-application-global": "^2.0.0",
     "ember-load-initializers": "^1.0.0",
+    "ember-maybe-import-regenerator": "^0.1.6",
     "ember-resolver": "^4.0.0",
     "ember-simple-google-maps": "^1.0.0",
-    "ember-source": "~2.18.0",
+    "ember-source": "~3.0.0",
     "eslint-plugin-ember": "^5.0.0",
     "loader.js": "^4.2.3"
   },

testem.js

@@ -11,11 +11,14 @@ module.exports = {
     Chrome: {
       mode: 'ci',
       args: [
+        // --no-sandbox is needed when running Chrome inside a container
+        process.env.TRAVIS ? '--no-sandbox' : null,
+
         '--disable-gpu',
         '--headless',
         '--remote-debugging-port=0',
         '--window-size=1440,900'
-      ]
+      ].filter(Boolean)
     }
   }
 };

tests/acceptance/list-rentals-test.js

@@ -1,67 +1,63 @@
 import Service from '@ember/service';
-import { test } from 'qunit';
-import moduleForAcceptance from 'super-rentals/tests/helpers/module-for-acceptance';
+import { module, test } from 'qunit';
+import { setupApplicationTest } from 'ember-qunit';
+import {
+  click,
+  currentURL,
+  visit,
+  fillIn,
+  triggerKeyEvent
+} from '@ember/test-helpers'
 
 let StubMapsService = Service.extend({
   getMapElement() {
     return document.createElement('div');
   }
 });
 
-moduleForAcceptance('Acceptance | list rentals', {
-  beforeEach() {
-    this.application.register('service:mockMaps', StubMapsService);
-    this.application.inject('component:location-map', 'maps', 'service:mockMaps');
-  }
-});
+module('Acceptance | list rentals', function(hooks) {
+  setupApplicationTest(hooks);
 
-test('should redirect to rentals route', function (assert) {
-  visit('/');
-  andThen(function() {
+  hooks.beforeEach(function() {
+    this.owner.register('service:maps', StubMapsService);
+  });
+
+  test('should redirect to rentals route', async function(assert) {
+    await visit('/');
     assert.equal(currentURL(), '/rentals', 'should redirect automatically');
   });
-});
 
 
-test('should link to about page', function (assert) {
-  visit('/');
-  click('a:contains("About")');
-  andThen(function () {
+  test('should link to about page', async function(assert) {
+    await visit('/');
+    await click(".menu-about");
     assert.equal(currentURL(), '/about', 'should navigate to about');
   });
-});
 
-test('should link to contacts page', function (assert) {
-  visit('/');
-  click('a:contains("Contact")');
-  andThen(function () {
+  test('should link to contacts page', async function(assert) {
+    await visit('/');
+    await click(".menu-contact");
     assert.equal(currentURL(), '/contact', 'should navigate to contact');
   });
-});
 
-test('should initially list 3 rentals', function (assert) {
-  visit('/');
-  andThen(function () {
-    assert.equal(find('.results .listing').length, 3, 'should display 3 listings');
+  test('should list available rentals', async function(assert) {
+    await visit('/');
+    assert.equal(this.element.querySelectorAll('.results .listing').length, 3, 'should display 3 listings');
   });
-});
 
-test('should list 1 rental when filtering by Seattle', function (assert) {
-  visit('/');
-  fillIn('.list-filter input', 'seattle');
-  keyEvent('.list-filter input', 'keyup', 69);
-  andThen(function () {
-    assert.equal(find('.results .listing').length, 1, 'should display 1 listing');
-    assert.equal(find('.listing .location:contains("Seattle")').length, 1, 'should contain 1 listing with location Seattle');
+  test('should filter the list of rentals by city', async function(assert) {
+    await visit('/');
+    await fillIn('.list-filter input', 'seattle');
+    await triggerKeyEvent('.list-filter input', 'keyup', 69);
+    assert.ok(this.element.querySelector('.results .listing'), 'should display 1 listing');
+    assert.ok(this.element.querySelector('.listing .location').textContent.includes('Seattle'), 'should contain 1 listing with location Seattle');
   });
-});
 
-test('should show details for a specific rental', function (assert) {
-  visit('/rentals');
-  click('a:contains("Grand Old Mansion")');
-  andThen(function() {
+  test('should show details for a specific rental', async function(assert) {
+    await visit('/rentals');
+    await click(".grand-old-mansion");
     assert.equal(currentURL(), '/rentals/grand-old-mansion', "should navigate to show route");
-    assert.equal(find('.show-listing h2').text(), "Grand Old Mansion", 'should list rental title');
-    assert.equal(find('.description').length, 1, 'should list a description of the property');
+    assert.ok(this.element.querySelector('.show-listing h2').textContent.includes("Grand Old Mansion"), 'should list rental title');
+    assert.ok(this.element.querySelector('.show-listing .description'), 'should list a description of the property');
   });
 });