Rightclick command

app/assets/css/styles.css

@@ -146,7 +146,7 @@ li.header {
   border: 5px solid red;
 }
 
-.action-div {
+.action-div, .rightclick-action-div {
   cursor: pointer;
 }
 

app/assets/js/scripts.js

@@ -46,6 +46,12 @@ $(() => {
     $(e.currentTarget).addClass('hidden')
   })
 
+  // listen to contextmenu to demonstrate logic on right click command
+  $('.rightclick-action-div').on('contextmenu', (e) => {
+    $('.rightclick-action-input-hidden').removeClass('hidden').focus()
+    $(e.currentTarget).addClass('hidden')
+  })
+
   // listen to focus to demonstrate logic on focus command
   $('.action-focus').on('focus', (e) => {
     $(e.currentTarget).addClass('focus')

app/commands/actions.html

@@ -280,6 +280,28 @@ <h4><a href="https://on.cypress.io/dblclick">.dblclick()</a></h4>
 
         <div class="col-xs-12"><hr></div>
 
+        <div class="col-xs-7">
+          <h4><a href="https://on.cypress.io/rightclick">.rightclick()</a></h4>
+          <p>To right click a DOM element, use the <a href="https://on.cypress.io/rightclick"><code>.rightclick()</code></a>
+            command.</p>
+          <pre><code class="javascript">cy.get('.action-div').rightclick().should('not.be.visible')
+        cy.get('.action-input-hidden').should('be.visible')</code></pre>
+        </div>
+        <div class="col-xs-5">
+          <div class="well">
+            <form>
+              <div class="form-group">
+                <div class="rightclick-action-div">Right click to edit</div>
+                <input type="text" class="rightclick-action-input-hidden hidden form-control" value="Right click to edit">
+              </div>
+            </form>
+          </div>
+        </div>
+
+        <div class="col-xs-12">
+          <hr>
+        </div>
+
         <div class="col-xs-7">
           <h4><a href="https://on.cypress.io/check">.check()</a></h4>
           <p>To check a checkbox or radio, use the <a href="https://on.cypress.io/check"><code>.check()</code></a> command.</p>

circle.yml

@@ -9,13 +9,49 @@ version: 2.1
 orbs:
   # use Cypress orb from CircleCI registry
   cypress: cypress-io/cypress@1.11.0
+  # for testing on Windows
+  # https://circleci.com/docs/2.0/hello-world-windows/
+  win: circleci/windows@1
 
 executors:
   mac:
     macos:
       xcode: "10.1.0"
 
 jobs:
+  win-test:
+    working_directory: ~/app
+    executor:
+      name: win/vs2019
+      shell: bash.exe
+    steps:
+      - checkout
+
+      - restore_cache:
+          key: dependencies-{{ arch }}-{{ .Branch }}-{{ checksum "package.json" }}
+
+      - run: npm ci
+      - run: npm run cy:verify
+
+      - save_cache:
+          key: dependencies-{{ arch }}-{{ .Branch }}-{{ checksum "package.json" }}
+          paths:
+            # could not use environment variables for some reason
+            - C:\Users\circleci\AppData\Local\Cypress\Cache
+            - C:\Users\circleci\AppData\Roaming\npm-cache
+
+      # if you want to test execa's behavior on Windows
+      # - run: node ./scripts/test-execa
+
+      - run:
+          name: 'Start server'
+          command: npm run start:ci:windows
+          background: true
+
+      - run: npm run e2e:record -- --env circle=true
+      - store_artifacts:
+          path: cypress\screenshots
+
   release:
     executor: cypress/base-10
     steps:
@@ -24,6 +60,10 @@ jobs:
       - run: npm run semantic-release
 
 workflows:
+  win-build:
+    jobs:
+      - win-test
+
   mac-build:
     jobs:
       # split into install + test jobs when Mac caching is correct

cypress/integration/examples/actions.spec.js

@@ -120,6 +120,15 @@ context('Actions', () => {
     cy.get('.action-input-hidden').should('be.visible')
   })
 
+  it('.rightclick() - right click on a DOM element', () => {
+    // https://on.cypress.io/rightclick
+
+    // Our app has a listener on 'contextmenu' event in our 'scripts.js'
+    // that hides the div and shows an input on right click
+    cy.get('.rightclick-action-div').rightclick().should('not.be.visible')
+    cy.get('.rightclick-action-input-hidden').should('be.visible')
+  })
+
   it('.check() - check a checkbox or radio element', () => {
     // https://on.cypress.io/check
 

cypress/integration/examples/misc.spec.js

@@ -20,19 +20,28 @@ context('Misc', () => {
   })
 
   it('cy.exec() - execute a system command', () => {
-    // https://on.cypress.io/exec
-
     // execute a system command.
     // so you can take actions necessary for
     // your test outside the scope of Cypress.
-    cy.exec('echo Jane Lane')
-      .its('stdout').should('contain', 'Jane Lane')
+    // https://on.cypress.io/exec
 
     // we can use Cypress.platform string to
     // select appropriate command
     // https://on.cypress/io/platform
     cy.log(`Platform ${Cypress.platform} architecture ${Cypress.arch}`)
 
+    // on CircleCI Windows build machines we have a failure to run bash shell
+    // https://github.com/cypress-io/cypress/issues/5169
+    // so skip some of the tests by passing flag "--env circle=true"
+    const isCircleOnWindows = Cypress.platform === 'win32' && Cypress.env('circle')
+
+    if (isCircleOnWindows) {
+      return
+    }
+
+    cy.exec('echo Jane Lane')
+      .its('stdout').should('contain', 'Jane Lane')
+
     if (Cypress.platform === 'win32') {
       cy.exec('print cypress.json')
         .its('stderr').should('be.empty')

package.json

@@ -64,14 +64,15 @@
     "eslint-plugin-cypress": "2.6.1",
     "eslint-plugin-cypress-dev": "2.1.0",
     "eslint-plugin-mocha": "5.3.0",
+    "execa": "2.0.4",
     "globby": "9.1.0",
     "husky": "1.3.1",
     "semantic-release": "15.13.24",
     "start-server-and-test": "1.9.1",
     "stop-build": "1.1.0",
     "stop-only": "3.1.0",
-    "yaml-lint": "1.2.4",
-    "typescript": "3.5.3"
+    "typescript": "3.5.3",
+    "yaml-lint": "1.2.4"
   },
   "engines": {
     "node": ">=4"

scripts/test-execa.js

@@ -0,0 +1,5 @@
+const execa = require('execa')
+
+execa('echo Hello', {
+  shell: true,
+}).then(console.log)