Add slugged-route-model-details page object (#1600)

Author: Dave Connis

tests/integration/components/slugged-route-model-details-test.js

@@ -1,28 +1,41 @@
 import { moduleForComponent, test } from 'ember-qunit';
 import hbs from 'htmlbars-inline-precompile';
 import { mockRouter } from 'code-corps-ember/tests/helpers/mock-routing';
+import PageObject from 'ember-cli-page-object';
+import component from 'code-corps-ember/tests/pages/components/slugged-route-model-details';
+
+let page = PageObject.create(component);
+
+function renderPage() {
+  page.render(hbs`
+    {{slugged-route-model-details
+      sluggedRoute=sluggedRoute
+      organization=sluggedRoute.organization
+      user=sluggedRoute.user
+    }}`
+  );
+}
 
 moduleForComponent('slugged-route-model-details', 'Integration | Component | slugged route model details', {
   integration: true,
   beforeEach() {
+    page.setContext(this);
     mockRouter(this);
+  },
+  afterEach() {
+    page.removeContext();
   }
 });
 
-test('it renders', function(assert) {
-  this.render(hbs`{{slugged-route-model-details}}`);
-  assert.equal(this.$('.slugged-route-model-details').length, 1);
-});
-
 test('when the slugged route is an organization, it renders the organization component', function(assert) {
   assert.expect(1);
 
   let sluggedRoute = { organization: {} };
 
   this.set('sluggedRoute', sluggedRoute);
-  this.render(hbs`{{slugged-route-model-details sluggedRoute=sluggedRoute}}`);
+  renderPage();
 
-  assert.equal(this.$('.organization-profile').length, 1);
+  assert.ok(page.organizationProfile.isVisible, 'organization component is rendered.');
 });
 
 test('when the slugged route is a user, it renders the user component', function(assert) {
@@ -31,7 +44,7 @@ test('when the slugged route is a user, it renders the user component', function
   let sluggedRoute = { user: {} };
 
   this.set('sluggedRoute', sluggedRoute);
-  this.render(hbs`{{slugged-route-model-details sluggedRoute=sluggedRoute}}`);
+  renderPage();
 
-  assert.equal(this.$('.user-details').length, 1);
+  assert.ok(page.userDetails.isVisible, 'the user component is rendered.');
 });

tests/pages/components/slugged-route-model-details.js

@@ -0,0 +1,9 @@
+import organizationProfile from 'code-corps-ember/tests/pages/components/organization-profile';
+import userDetails from 'code-corps-ember/tests/pages/components/user-details';
+
+export default {
+  scope: '.slugged-route-model-details',
+
+  organizationProfile,
+  userDetails
+};