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

vitest with happy-dom: window.CSS.supports is undefined #4576

Closed
6 tasks done
dr2009 opened this issue Nov 23, 2023 · 3 comments · Fixed by #4601
Closed
6 tasks done

vitest with happy-dom: window.CSS.supports is undefined #4576

dr2009 opened this issue Nov 23, 2023 · 3 comments · Fixed by #4601
Labels
p3-minor-bug An edge case that only affects very specific usage (priority)

Comments

@dr2009
Copy link

dr2009 commented Nov 23, 2023

Describe the bug

// environment: 'happy-dom'
console.log(CSS); // { escape: [Function: cssEscape] }
expect(CSS.escape).toBeDefined(); // ok
expect(CSS.supports).toBeDefined(); // not ok

becuase happy-dom depends css.escape, it will change global.CSS to { escape: cssEscape } when import it

https://github.com/mathiasbynens/CSS.escape/blob/master/css.escape.js#L97-L101

Reproduction

https://stackblitz.com/edit/vitest-dev-vitest-12tbkc?file=vite.config.ts,test%2Fsuite.test.ts,test%2Fbasic.test.ts&initialPath=__vitest__/

System Info

System:
    OS: macOS 13.2
    CPU: (8) arm64 Apple M1
    Memory: 155.31 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 20.9.0 - ~/Library/Caches/fnm_multishells/15709_1700617114296/bin/node
    npm: 10.1.0 - ~/Library/Caches/fnm_multishells/15709_1700617114296/bin/npm
    pnpm: 8.10.5 - ~/Library/Caches/fnm_multishells/15709_1700617114296/bin/pnpm
    bun: 1.0.0 - ~/.bun/bin/bun
  Browsers:
    Chrome: 119.0.6045.159
    Edge: 116.0.1938.76
    Safari: 16.3
    Safari Technology Preview: 16.4
  npmPackages:
    @vitest/coverage-v8: 1.0.0-beta.4 => 1.0.0-beta.4 
    vitest: 1.0.0-beta.4 => 1.0.0-beta.4

Used Package Manager

pnpm

Validations

@sheremet-va
Copy link
Member

If happy-dom doesn't provide a global variable, open an issue in happy-dom repository.

@sheremet-va sheremet-va closed this as not planned Won't fix, can't repro, duplicate, stale Nov 23, 2023
@dr2009
Copy link
Author

dr2009 commented Nov 24, 2023

If happy-dom doesn't provide a global variable, open an issue in happy-dom repository.

happy-dom provide the global variable: CSS
but vitest populateGlobal lost it @sheremet-va

https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/integrations/env/happy-dom.ts#L50C33-L50C47
win.CSS ok, but global.CSS { escape: [Function: cssEscape] }

becuase happy-dom depends css.escape, it will change global.CSS to { escape: cssEscape } when import it

getWindowKeys
https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/integrations/env/utils.ts#L10


i solved by pnpm patch

global.CSS = win.CSS;
const { keys, originals } = populateGlobal(global, win, { bindFunctions: true });

@sheremet-va
Copy link
Member

You are right, sorry for closing the issue.

@sheremet-va sheremet-va reopened this Nov 27, 2023
@sheremet-va sheremet-va added bug p3-minor-bug An edge case that only affects very specific usage (priority) and removed pending triage labels Nov 27, 2023
@github-actions github-actions bot locked and limited conversation to collaborators Dec 12, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
p3-minor-bug An edge case that only affects very specific usage (priority)
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants