Merge remote-tracking branch 'origin/develop' into declarative-test-c…

…onfigs
cypress-io · Feb 14, 2020 · 599d978 · 599d978
2 parents bf8bc35 + 1069310
commit 599d978
Show file tree

Hide file tree

Showing 21 changed files with 212 additions and 173 deletions.
diff --git a/cli/types/index.d.ts b/cli/types/index.d.ts
@@ -75,7 +75,7 @@ declare namespace Cypress {
     (task: 'firefox:force:gc'): Promise<void>
   }
 
-  type BrowserName = 'electron' | 'chrome' | 'chromium' | 'firefox' | 'edge' | 'brave' | string
+  type BrowserName = 'electron' | 'chrome' | 'chromium' | 'firefox' | 'edge' | string
 
   type BrowserChannel = 'stable' | 'canary' | 'beta' | 'dev' | 'nightly' | string
 
@@ -339,10 +339,10 @@ declare namespace Cypress {
     /**
      * Returns true if currently running the supplied browser name or matcher object.
      * @example isBrowser('chrome') will be true for the browser 'chrome:canary' and 'chrome:stable'
-     * @example isBrowser({ name: 'firefox' channel: 'dev' }) will be true only for the browser 'firefox:dev' (Firefox Developer Edition)
+     * @example isBrowser({ name: 'firefox', channel: 'dev' }) will be true only for the browser 'firefox:dev' (Firefox Developer Edition)
      * @param matcher browser name or matcher object to check.
      */
-    isBrowser(matcher: IsBrowserMatcher): boolean
+    isBrowser(name: IsBrowserMatcher): boolean
 
     /**
      * Internal options for "cy.log" used in custom commands.

diff --git a/cli/types/tests/cypress-tests.ts b/cli/types/tests/cypress-tests.ts
@@ -344,13 +344,17 @@ namespace CypressBrowserTests {
   Cypress.isBrowser('firefox')// $ExpectType boolean
   Cypress.isBrowser('edge')// $ExpectType boolean
   Cypress.isBrowser('brave')// $ExpectType boolean
+
+  // does not error to allow for user supplied browsers
+  Cypress.isBrowser('safari')// $ExpectType boolean
+
   Cypress.isBrowser({channel: 'stable'})// $ExpectType boolean
   Cypress.isBrowser({family: 'chromium'})// $ExpectType boolean
   Cypress.isBrowser({name: 'chrome'})// $ExpectType boolean
+
   Cypress.isBrowser({family: 'foo'}) // $ExpectError
   Cypress.isBrowser() // $ExpectError
 }
-
 namespace CypressTestConfigTests {
   it('test', {
     browser: {name: 'firefox'}

diff --git a/packages/desktop-gui/cypress/integration/login_spec.js b/packages/desktop-gui/cypress/integration/login_spec.js
@@ -96,9 +96,7 @@ describe('Login', function () {
           })
 
           it('displays username in UI', function () {
-            cy.get('nav a').should(function ($a) {
-              expect($a).to.contain(this.user.name)
-            })
+            cy.get('.user-dropdown .dropdown-chosen').should('contain', this.user.name)
           })
 
           it('displays username in success dialog', () => {
@@ -117,22 +115,22 @@ describe('Login', function () {
 
             context('log out', function () {
               it('displays login button on logout', () => {
-                cy.get('nav a').contains('Jane').click()
+                cy.get('.user-dropdown .dropdown-chosen').contains('Jane').click()
 
                 cy.contains('Log Out').click()
                 cy.get('.nav').contains('Log In')
               })
 
               it('calls log:out', function () {
-                cy.get('nav a').contains('Jane').click()
+                cy.get('.user-dropdown .dropdown-chosen').contains('Jane').click()
 
                 cy.contains('Log Out').click().then(function () {
                   expect(this.ipc.logOut).to.be.called
                 })
               })
 
               it('has login button enabled when returning to login after logout', function () {
-                cy.get('nav a').contains('Jane').click()
+                cy.get('.user-dropdown .dropdown-chosen').contains('Jane').click()
                 cy.contains('Log Out').click()
                 cy.contains('Log In').click()
 

diff --git a/packages/desktop-gui/cypress/integration/nav_spec.js b/packages/desktop-gui/cypress/integration/nav_spec.js
@@ -61,7 +61,7 @@ describe('Navigation', function () {
     })
 
     it('displays user name', () => {
-      cy.get('nav a').should(function ($a) {
+      cy.get('.user-dropdown .dropdown-chosen').should(function ($a) {
         expect($a).to.contain(this.user.name)
       })
     })
@@ -121,7 +121,7 @@ describe('Navigation', function () {
     })
 
     it('displays email instead of name', () => {
-      cy.get('nav a').should(function ($a) {
+      cy.get('.user-dropdown .dropdown-chosen').should(function ($a) {
         expect($a).to.contain(this.user.email)
       })
     })

diff --git a/packages/desktop-gui/src/app/nav.jsx b/packages/desktop-gui/src/app/nav.jsx
@@ -1,5 +1,6 @@
 import { observer } from 'mobx-react'
 import React, { Component } from 'react'
+import { Dropdown } from '@packages/ui-components'
 
 import appStore from '../lib/app-store'
 import authApi from '../auth/auth-api'
@@ -9,8 +10,6 @@ import ipc from '../lib/ipc'
 import { gravatarUrl } from '../lib/utils'
 import { Link, routes } from '../lib/routing'
 
-import Dropdown from '../dropdown/dropdown'
-
 @observer
 export default class Nav extends Component {
   render () {
@@ -87,7 +86,7 @@ export default class Nav extends Component {
 
     return (
       <Dropdown
-        className='dropdown-toggle'
+        className='user-dropdown'
         chosen={{ id: 'user' }}
         others={[{ id: 'logout' }]}
         onSelect={this._select}

diff --git a/packages/desktop-gui/src/app/nav.scss b/packages/desktop-gui/src/app/nav.scss
@@ -129,8 +129,8 @@
   }
 
   .nav {
-    > .open {
-      > a, > a:hover, > a:focus {
+    .dropdown-chosen {
+      &:hover, &:focus {
         background-color: #111;
         color: #fff;
       }
@@ -140,6 +140,13 @@
       font-size: 12px;
     }
 
+    .dropdown-menu > li {
+      line-height: 30px;
+      font-size: 14px;
+      padding: 5px 15px;
+    }
+
+    .dropdown-chosen,
     > li > div,
     > li > a,
     > li > span > a  {
@@ -150,6 +157,7 @@
       display: inline-block;
     }
 
+    .dropdown-chosen,
     > li > a,
     > li > span > a  {
       &:hover,
@@ -163,23 +171,27 @@
 
 .browsers-list {
   margin: 5px;
-  border: 1px solid #c7c7c7;
-  border-radius: 4px;
 
   li {
     padding: 9px 15px;
     white-space: nowrap;
   }
 
-  &>a.dropdown-chosen {
+  .dropdown-chosen {
     border-radius: 4px;
+    border: 1px solid #c7c7c7;
     line-height: 28px !important;
     background-color: #f6f6f6;
 
     img {
       position: relative;
       top: -1px;
     }
+
+    &.disabled,
+    &:active {
+      background-color: #dedede;
+    }
   }
 
   .fa-check-circle, .fa-sync-alt {

diff --git a/packages/desktop-gui/src/main.scss b/packages/desktop-gui/src/main.scss
@@ -3,3 +3,4 @@
 @import 'styles/vendor';
 @import 'styles/components/*';
 @import '!(styles)*/**/*';
+@import '../../ui-components/src/dropdown';
diff --git a/packages/desktop-gui/src/project-nav/browsers.jsx b/packages/desktop-gui/src/project-nav/browsers.jsx
@@ -1,11 +1,9 @@
 import React, { Component } from 'react'
 import { observer } from 'mobx-react'
 import Tooltip from '@cypress/react-tooltip'
-import { BrowserIcon } from '@packages/ui-components'
+import { BrowserIcon, Dropdown } from '@packages/ui-components'
 
-import Dropdown from '../dropdown/dropdown'
 import MarkdownRenderer from '../lib/markdown-renderer'
-
 import projectsApi from '../projects/projects-api'
 
 @observer

diff --git a/packages/runner/src/dropdown/dropdown.jsx b/packages/runner/src/dropdown/dropdown.jsx
diff --git a/packages/runner/src/dropdown/dropdown.scss b/packages/runner/src/dropdown/dropdown.scss
diff --git a/packages/runner/src/errors/errors.scss b/packages/runner/src/errors/errors.scss
@@ -47,11 +47,29 @@
       top: -1px;
 
       &.fa-globe {
-        top: 0; 
+        top: 0;
       }
     }
   }
 
+  &.automation-failure {
+    .browser-icon {
+      margin-right: 5px;
+      vertical-align: middle;
+      position: relative;
+      top: -1px;
+    }
+
+    .dropdown-toggle {
+      margin-left: 5px;
+    }
+
+    .dropdown-menu li {
+      padding: 8px 12px;
+      white-space: nowrap;
+    }
+  }
+
   .automation-disconnected button {
     font-size: 18px;
     line-height: 1.3;

diff --git a/packages/runner/src/errors/no-automation.jsx b/packages/runner/src/errors/no-automation.jsx
@@ -1,8 +1,6 @@
 import _ from 'lodash'
 import React from 'react'
-import { BrowserIcon } from '@packages/ui-components'
-
-import Dropdown from '../dropdown/dropdown'
+import { BrowserIcon, Dropdown } from '@packages/ui-components'
 
 const displayName = (name) => _.capitalize(name)
 
@@ -42,6 +40,7 @@ const browserPicker = (browsers, onLaunchBrowser) => {
         others={otherBrowsers}
         onSelect={onLaunchBrowser}
         renderItem={browser}
+        keyProperty='key'
       />
     </div>
   )

diff --git a/packages/runner/src/main.scss b/packages/runner/src/main.scss
@@ -6,4 +6,5 @@
 @import 'lib/shared';
 @import '!(lib)*/**/!(selector-playground.scss)';
 
+@import '../../ui-components/src/dropdown';
 @import '../../reporter/src/main-runner';