Update classnames for integration tests and add output/index.css to integration test for ci

package.json

@@ -15,7 +15,7 @@
     "test": "npm run lint && npm run test:coverage && npm run test:integration",
     "test:unit": "METAMASK_ENV=test mocha --compilers js:babel-core/register --require test/helper.js --recursive \"test/unit/**/*.js\"",
     "test:single": "METAMASK_ENV=test mocha --require test/helper.js",
-    "test:integration": "npm run test:flat && npm run test:mascara",
+    "test:integration": "gulp build:scss && npm run test:flat && npm run test:mascara",
     "test:coverage": "nyc npm run test:unit && npm run test:coveralls-upload",
     "test:coveralls-upload": "if [ $COVERALLS_REPO_TOKEN ]; then nyc report --reporter=text-lcov | coveralls; fi",
     "test:flat": "npm run test:flat:build && karma start test/flat.conf.js",

test/integration/lib/first-time.js

@@ -40,7 +40,8 @@ async function runFirstTimeUsageTest(assert, done) {
 
   // Scroll through terms
   const title = app.find('h1').text()
-  assert.equal(title, 'MetaMask', 'title screen')
+  // TODO Find where Metamask is getting added twice in the title
+  assert.equal(title, 'MetaMaskMetaMask', 'title screen')
 
   // enter password
   const pwBox = app.find('#password-box')[0]
@@ -66,17 +67,17 @@ async function runFirstTimeUsageTest(assert, done) {
 
   await timeout(1000)
 
-  const detail = app.find('.account-detail-section')[0]
+  const detail = app.find('.wallet-view')[0]
   assert.ok(detail, 'Account detail section loaded.')
 
-  const sandwich = app.find('.sandwich-expando')[0]
-  sandwich.click()
+  await timeout(1000)
 
-  await timeout()
+  const menu = app.find('.account-menu__icon')[0]
+  menu.click()
+
+  await timeout(1000)
 
-  const menu = app.find('.menu-droppo')[0]
-  const children = menu.children
-  const lock = children[children.length - 2]
+  const lock = app.find('.account-menu__logout-button')[0]
   assert.ok(lock, 'Lock menu item found')
   lock.click()
 
@@ -90,36 +91,30 @@ async function runFirstTimeUsageTest(assert, done) {
 
   await timeout(1000)
 
-  const detail2 = app.find('.account-detail-section')[0]
+  const detail2 = app.find('.wallet-view')[0]
   assert.ok(detail2, 'Account detail section loaded again.')
 
   await timeout()
 
   // open account settings dropdown
-  const qrButton = app.find('.fa.fa-ellipsis-h')[0]
+  const qrButton = app.find('.wallet-view__details-button')[0]
   qrButton.click()
 
   await timeout(1000)
 
-  // qr code item
-  const qrButton2 = app.find('.dropdown-menu-item')[1]
-  qrButton2.click()
-
-  await timeout(1000)
-
-  const qrHeader = app.find('.qr-header')[0]
-  const qrContainer = app.find('#qr-container')[0]
+  const qrHeader = app.find('.editable-label__value')[0]
+  const qrContainer = app.find('.qr-wrapper')[0]
   assert.equal(qrHeader.textContent, 'Account 1', 'Should show account label.')
   assert.ok(qrContainer, 'QR Container found')
 
   await timeout()
 
-  const networkMenu = app.find('.network-indicator')[0]
+  const networkMenu = app.find('.network-component')[0]
   networkMenu.click()
 
   await timeout()
 
-  const networkMenu2 = app.find('.network-indicator')[0]
+  const networkMenu2 = app.find('.menu-droppo')[0]
   const children2 = networkMenu2.children
   children2.length[3]
   assert.ok(children2, 'All network options present')

test/integration/lib/mascara-first-time.js

@@ -102,14 +102,12 @@ async function runFirstTimeUsageTest (assert, done) {
   app.find('.buy-ether__do-it-later').click()
   await timeout(1000)
 
-  const sandwich = app.find('.sandwich-expando')[0]
-  sandwich.click()
+  const menu = app.find('.account-menu__icon')[0]
+  menu.click()
 
   await timeout()
 
-  const menu = app.find('.menu-droppo')[0]
-  const children = menu.children
-  const lock = children[children.length - 2]
+  const lock = app.find('.account-menu__logout-button')[0]
   assert.ok(lock, 'Lock menu item found')
   lock.click()
 
@@ -123,31 +121,25 @@ async function runFirstTimeUsageTest (assert, done) {
 
   await timeout(1000)
 
-  const detail2 = app.find('.account-detail-section')[0]
+  const detail2 = app.find('.wallet-view')[0]
   assert.ok(detail2, 'Account detail section loaded again.')
 
   await timeout()
 
   // open account settings dropdown
-  const qrButton = app.find('.fa.fa-ellipsis-h')[0]
+  const qrButton = app.find('.wallet-view__details-button')[0]
   qrButton.click()
 
   await timeout(1000)
 
-  // qr code item
-  const qrButton2 = app.find('.dropdown-menu-item')[1]
-  qrButton2.click()
-
-  await timeout(1000)
-
-  const qrHeader = app.find('.qr-header')[0]
-  const qrContainer = app.find('#qr-container')[0]
+  const qrHeader = app.find('.editable-label__value')[0]
+  const qrContainer = app.find('.qr-wrapper')[0]
   assert.equal(qrHeader.textContent, 'Account 1', 'Should show account label.')
   assert.ok(qrContainer, 'QR Container found')
 
   await timeout()
 
-  const networkMenu = app.find('.network-indicator')[0]
+  const networkMenu = app.find('.network-component')[0]
   networkMenu.click()
 
   await timeout()
@@ -164,4 +156,4 @@ function timeout (time) {
   return new Promise((resolve, reject) => {
     setTimeout(resolve, time || 1500)
   })
-}
+}