fix: upgrade plugin for newer cypress versions (#533)

* update deps, migrate cypress config

* update deps, migrate cypress config

* fix functionality

* use import instead of require

* add types

* add types

* update readme

* add .d.ts to files

* add wrongly ignored js spec files and cypress-config

---------

Co-authored-by: Simon Fischer <[email protected]>

.gitignore

@@ -1,4 +1,7 @@
+.idea
 node_modules/
 cypress/screenshots
 cypress/videos
 *.js
+!cypress/**
+*.d.ts

README.md

@@ -12,30 +12,38 @@
 npm i -D cypress-skip-and-only-ui
 ```
 
-Require from your `cypress/support/index.js`
+Import from your `cypress/support/e2e.js`
 
 ```js
-require('cypress-skip-and-only-ui/support')
+import 'cypress-skip-and-only-ui/support';
 ```
 
-Require and register task from `cypress/plugins/index.js`
+Import and register task from `cypress.config.ts` / `cypress.config.js`
 
 ```js
-const task = require('cypress-skip-and-only-ui/task')
-module.exports = (on, config) => {
-  on('task', task)
-}
+import { defineConfig } from 'cypress'
+import skipAndOnlyUiTasks from 'cypress-skip-and-only-ui/task';
+
+export default defineConfig({
+  e2e: {
+    setupNodeEvents(on, config) {
+      on('task', skipAndOnlyUiTasks)
+    }
+  }
+});
 ```
 
 Note: if you have other tasks already, just merge the objects before registering
 
 ```js
-const otherTask = { ... }
-const task = require('cypress-skip-and-only-ui/task')
+import { defineConfig } from 'cypress'
+import skipAndOnlyUiTasks from 'cypress-skip-and-only-ui/task';
+
+const otherTasks = [{ ... }]
 module.exports = (on, config) => {
   on('task', {
-    otherTask,
-    task
+    ...otherTasks,
+    ...skipAndOnlyUiTasks
   })
 }
 ```

cypress.config.ts

@@ -0,0 +1,10 @@
+import { defineConfig } from 'cypress'
+import task from './task';
+
+export default defineConfig({
+  e2e: {
+    setupNodeEvents(on, config) {
+      on('task', task)
+    }
+  }
+});

cypress/integration/es6-spec.js → cypress/e2e/es6-spec.cy.js

@@ -6,4 +6,4 @@ it('works with imports', () => {
 
 it('works with imports 2', () => {
   expect(foo).to.be.a('string')
-})
+})

cypress/integration/spec.js → cypress/e2e/spec.cy.js

@@ -14,4 +14,4 @@ describe('several tests together', () => {
   context('inner', () => {
     it('has deep test', () => {})
   })
-})
+})

cypress/support/index.js → cypress/support/e2e.js

@@ -14,9 +14,8 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
-
-require('../../support')
-
+import './commands';
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
+
+import '../../support';