feat: Add TypeScript support for Cypress action events #1187

NicholasBoll · 2018-01-11T18:31:31Z

Added support for Cypress.on and cy.on
Added documentation for the various action events documented https://docs.cypress.io/api/events/catalog-of-events.html#App-Events
Added dt tests for the action callbacks

bahmutov · 2018-01-11T18:35:26Z

cli/types/index.d.ts

@@ -2934,6 +2942,130 @@ declare namespace Cypress {
    (fn: (currentSubject: Subject) => void): Chainable<Subject>
  }

+  /**
+   * These events come from the application currently under test (your application). These are the most useful events for you to listen to.
+   * @see https://docs.cypress.io/api/events/catalog-of-events.html#App-Events


One thing we REALLY do not want is to put direct urls to any resource, because these are likely to change. The same url should go through our on.cypress.io redirect service. Usually it is just document title, this url would be https://on.cypress.io/catalog-of-events#App-Events

Oh. Thanks. That was one of my review comments. I was trying to figure out what the redirect URL was

Updated the URLs. Is there a conventions for those URL redirects? I tried a few including https://on.cypress.io/events/catalog-of-events#App-Events

bahmutov

All good except for direct documentation url

NicholasBoll · 2018-01-11T18:33:40Z

cli/types/index.d.ts

+     *   // failing the test
+     *   return false
+     * })
+     * @see https://docs.cypress.io/api/events/catalog-of-events.html#App-Events


Should there be linkability to individual events? Right now this will jump to the table of actions. Also I don't know if that is the official URL. I noticed the Cypress team use a redirect URL for Cypress commands. I couldn't find anything that matched that pattern (on.cypress.io/...) that redirected to the correct page. Feel free to suggest a redirect URL.

NicholasBoll · 2018-01-11T18:34:10Z

cli/types/index.d.ts

+     * })
+     * @see https://docs.cypress.io/api/events/catalog-of-events.html#App-Events
+     */
+    (action: 'uncaught:exception', fn: (error: Error, runnable: Mocha.IRunnable) => false | void): void


The docs said it is the mocha runnable. I'm assuming this is the interface the docs meant

I included an example only in this action. This action at least gives an template for other actions to have examples added.

NicholasBoll · 2018-01-11T18:37:51Z

cli/types/index.d.ts

+     * Fires before the test and all **before** and **beforeEach** hooks run.
+     * @see https://docs.cypress.io/api/events/catalog-of-events.html#App-Events
+     */
+    (action: 'test:before:run', fn: (attributes: ObjectLike, test: Mocha.ITest) => void): void


It was hard to tell what this object might look like. I couldn't find a clear emitter of this event. I found emitting of the :async version referenced in socket.coffee. Feel free to reference a file for more clear typing. Right now ObjectLike says there can by any key in the object that has a value of any. Object or object won't work because then it is an object with no properties.

NicholasBoll · 2018-01-11T18:40:08Z

cli/types/index.d.ts

+    (action: 'test:after:run', fn: (attributes: ObjectLike, test: Mocha.ITest) => void): void
+  }
+
+  // $CommandQueue from `command_queue.coffee` - a lot to type. Might be more useful if it was written in TS


I didn't spend too much time fleshing out this entire interface. There is some implicit method definitions that come straight from lodash. I don't know if it is worth the effort before $CommandQueue is written in TypeScript. I added methods I thought might be important. Feel free to chime in if there are specific methods or properties that should be important to an external developers using the the command action event callbacks

absolutely, looks good

NicholasBoll · 2018-01-11T18:43:06Z

cli/types/index.d.ts

@@ -2960,6 +3092,14 @@ declare namespace Cypress {
    expiry?: string
  }

+  interface EnqueuedCommand {
+    name: string
+    args: any[]


I think any is all that we can guarantee. There could be a lot of work to create an interface of internal mapping of named commands like select with argument shapes. I don't know if that is worthwhile right now. It would make more sense if command implementations are written in TypeScript. This at least won't give any errors. I consider these events pretty advanced and will probably require an understanding of the source code anyways. any could always be cast to a more specific type in that case.

NicholasBoll · 2018-01-11T18:43:35Z

cli/types/index.d.ts

+    args: any[]
+    type: string
+    chainerId: string
+    fn(...args: any[]): any


I didn't dig far enough to find out what the shape of this was

NicholasBoll · 2018-01-11T18:44:18Z

cli/types/index.d.ts

@@ -2994,6 +3134,11 @@ declare namespace Cypress {
    whitelist: (xhr: any) => boolean
  }

+  interface Viewport {


I found this in window.coffee

NicholasBoll · 2018-01-11T19:43:11Z

I'll look into that unit test failure. npm run dtslint works locally.

bahmutov · 2018-01-11T20:11:40Z

Just add "newline-per-chained-call": false to cli/types/tslint.json - new version of typescript@next breaks it. You would get this failure locally if from cli you removed node_modules folder and installed again.

NicholasBoll · 2018-01-11T20:54:03Z

I updated and could reproduce the issue. I set the tslint.json setting and now only have a TypeScript error on typescript@next around the Omit implementation. This is probably a bug in TypeScript that will get resolved since there is otherwise no way of omitting properties of an interface.

NicholasBoll · 2018-01-11T20:58:04Z

It was suggested maybe this PR broke it? microsoft/TypeScript#17912

bahmutov · 2018-01-11T20:58:30Z

Yes I just put single and ignore for that particular line

…

Sent from my iPhone

On Jan 11, 2018, at 15:54, Nicholas Boll ***@***.***> wrote: I updated and could reproduce the issue. I set the tslint.json setting and now only have a TypeScript error on ***@***.*** around the Omit implementation. This is probably a bug in TypeScript that will get resolved since there is otherwise no way of omitting properties of an interface. — You are receiving this because your review was requested. Reply to this email directly, view it on GitHub, or mute the thread.

NicholasBoll · 2018-01-11T22:37:40Z

I added a fix. The TypeScript team has filed an issue: microsoft/TypeScript#21148

I hope they will have a solution before TypeScript 2.7 comes out (either fixed or a workaround provided to library authors). Right now it works. I guess we'll see what happens later. Worst thing for the Cypress type definitions is changing Omit references to Pick and give a long list of keys to pick rather than a short list of keys to omit.

NicholasBoll · 2018-01-12T04:12:22Z

It looks like the error will be fixed before TypeScript 2.7 ships: microsoft/TypeScript#21156

brian-mann · 2018-02-05T02:03:44Z

Released in 1.4.2.

feat: Add support for Cypress action events

d228fc8

bahmutov reviewed Jan 11, 2018

View reviewed changes

bahmutov self-requested a review January 11, 2018 18:36

bahmutov suggested changes Jan 11, 2018

View reviewed changes

NicholasBoll commented Jan 11, 2018

View reviewed changes

fix: Fixed documentation URL for actions

749f044

bahmutov approved these changes Jan 11, 2018

View reviewed changes

fix dtslint test failures

29d2b6b

bahmutov mentioned this pull request Jan 16, 2018

Banner to separate test output #1190

Merged

brian-mann merged commit ae8b147 into cypress-io:develop Jan 16, 2018

brian-mann added this to the 1.4.2 milestone Feb 4, 2018

NicholasBoll deleted the feat/support-actions branch March 28, 2018 21:39

NicholasBoll mentioned this pull request Mar 28, 2018

feat: Add type definitions for Cypress.off #1514

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Add TypeScript support for Cypress action events #1187

feat: Add TypeScript support for Cypress action events #1187

NicholasBoll commented Jan 11, 2018

bahmutov Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

bahmutov left a comment

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

bahmutov Jan 11, 2018

NicholasBoll Jan 11, 2018

bahmutov Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll Jan 11, 2018

NicholasBoll commented Jan 11, 2018

bahmutov commented Jan 11, 2018

NicholasBoll commented Jan 11, 2018

NicholasBoll commented Jan 11, 2018

bahmutov commented Jan 11, 2018 via email

NicholasBoll commented Jan 11, 2018

NicholasBoll commented Jan 12, 2018

brian-mann commented Feb 5, 2018 •

edited

feat: Add TypeScript support for Cypress action events #1187

feat: Add TypeScript support for Cypress action events #1187

Conversation

NicholasBoll commented Jan 11, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bahmutov left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

NicholasBoll commented Jan 11, 2018

bahmutov commented Jan 11, 2018

NicholasBoll commented Jan 11, 2018

NicholasBoll commented Jan 11, 2018

bahmutov commented Jan 11, 2018 via email

NicholasBoll commented Jan 11, 2018

NicholasBoll commented Jan 12, 2018

brian-mann commented Feb 5, 2018 • edited

brian-mann commented Feb 5, 2018 •

edited