Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Correct Window type. #7856

Closed
sainthkh opened this issue Jun 30, 2020 · 2 comments
Closed

Correct Window type. #7856

sainthkh opened this issue Jun 30, 2020 · 2 comments
Labels
type: breaking change Requires a new major release version type: typings Issue related to Cypress types (for TypeScript)

Comments

@sainthkh
Copy link
Contributor

Current behavior:

It's from #6624.

Previously this would type error:

cy.window().then(window => window.eval('1'));

(window should have type Window & typeof globalThis.)

You may want to fix other instances of Chainable<Window> as well.


It's from the comment in #6624

@OliverJAsh Regarding the issue we talked about — here's a suggestion for how we can really get the right Window yielded by cy.window().

If my suggestion falls outside the scope of this pull request, please let me know — I can open a separate issue or a pull request instead.

Problem

When you run a test with Cypress, there are two Window instances in play.

  1. The top Window object in which the Cypress UI lives, and
  2. The Window that represents the tested application.

These are different Windows, but they share the same definition. If you define additional properties by using declaration merging, they will appear on both, which in most cases is incorrect and leads to bugs.

Solution

Allow users to define global variables separately.

In cli/types/index.d.ts, define an empty interface called ApplicationWindow.

interface ApplicationWindow {}

Change the definition for cy.window so that the yielded object includes the properties defined by ApplicationWindow.

window(options?: Partial<Loggable & Timeoutable>): Chainable<Window & typeof globalThis & ApplicationWindow>

Usage

The users can now define properties that exist on the yielded window, but not on the window accessed directly inside a Cypress test.

declare global {
  namespace Cypress {
    interface ApplicationWindow {
      __FOO__?: string;
    }
  }
}

image

Originally posted by @karol-majewski in #6624 (comment)

Desired behavior:

  • Cypress Window definition should include globalThis definitions.
  • The type of Cypress ApplicationWindow can be extended.

Test code to reproduce

Versions

Cypress 4.9.0.

@jennifer-shehane jennifer-shehane added type: typings Issue related to Cypress types (for TypeScript) type: breaking change Requires a new major release version labels Jun 30, 2020
@cypress-bot cypress-bot bot added stage: work in progress stage: needs review The PR code is done & tested, needs review and removed stage: work in progress stage: needs review The PR code is done & tested, needs review labels Jun 30, 2020
@cypress-bot
Copy link
Contributor

cypress-bot bot commented Jul 6, 2020

The code for this is done in cypress-io/cypress#7806, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

@cypress-bot
Copy link
Contributor

cypress-bot bot commented Aug 20, 2020

Released in 5.0.0.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v5.0.0, please open a new issue.

@cypress-bot cypress-bot bot locked as resolved and limited conversation to collaborators Aug 20, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
type: breaking change Requires a new major release version type: typings Issue related to Cypress types (for TypeScript)
Projects
None yet
Development

No branches or pull requests

2 participants