#jsdom — Public Fediverse posts
Live and recent posts from across the Fediverse tagged #jsdom, aggregated by home.social.
-
#JavaScript, such a lovely programming environment
Writing some unit tests for a **browser** app which must parse historic XML (WebDAV result) I stumble upon
ReferenceError: DOMParser is not defined
It would be no problem in the browser itself, but the tests were supposed to run without browser. And node has no DOMParser, I just learned.
No problem, jsdom seems to be the library to go with. But then: https://npm.anvaka.com/#/view/2d/jsdom
45 dependencies😱
-
Over the last few days while working on an upcoming blog post I've performed quite the yak shaving:
1. I wanted to use `@layer` in a #CSS demo (ironically one showing that it doesn't solve this particular use case).
2. My auto #CSP setup using #JSDom and #CleanCSS failed to parse `@layer`.
3. I upgraded #CleanCSS.
4. I removed #JSDom and replaced it with #parse5, which works with `@layer`.
5. I wanted to use `Object.groupBy` here which requires `target: "ES2024"` in #TypeScript.
6. Therefore I needed to upgrade TS.
7. Upgrading TS broke #Karma for reasons I couldn't understand.
8. Therefore I migrated from Karma to #Vitest (which I've wanted to do anyways).
9. Now #Netlify is confused that I have both an 11ty and Vite project and fails, asking me to pick one.
10. I pick one in `netlify.toml`, but a bug in Netlify refuses to accept it. -
Over the last few days while working on an upcoming blog post I've performed quite the yak shaving:
1. I wanted to use `@layer` in a #CSS demo (ironically one showing that it doesn't solve this particular use case).
2. My auto #CSP setup using #JSDom and #CleanCSS failed to parse `@layer`.
3. I upgraded #CleanCSS.
4. I removed #JSDom and replaced it with #parse5, which works with `@layer`.
5. I wanted to use `Object.groupBy` here which requires `target: "ES2024"` in #TypeScript.
6. Therefore I needed to upgrade TS.
7. Upgrading TS broke #Karma for reasons I couldn't understand.
8. Therefore I migrated from Karma to #Vitest (which I've wanted to do anyways).
9. Now #Netlify is confused that I have both an 11ty and Vite project and fails, asking me to pick one.
10. I pick one in `netlify.toml`, but a bug in Netlify refuses to accept it. -
Over the last few days while working on an upcoming blog post I've performed quite the yak shaving:
1. I wanted to use `@layer` in a #CSS demo (ironically one showing that it doesn't solve this particular use case).
2. My auto #CSP setup using #JSDom and #CleanCSS failed to parse `@layer`.
3. I upgraded #CleanCSS.
4. I removed #JSDom and replaced it with #parse5, which works with `@layer`.
5. I wanted to use `Object.groupBy` here which requires `target: "ES2024"` in #TypeScript.
6. Therefore I needed to upgrade TS.
7. Upgrading TS broke #Karma for reasons I couldn't understand.
8. Therefore I migrated from Karma to #Vitest (which I've wanted to do anyways).
9. Now #Netlify is confused that I have both an 11ty and Vite project and fails, asking me to pick one.
10. I pick one in `netlify.toml`, but a bug in Netlify refuses to accept it. -
Over the last few days while working on an upcoming blog post I've performed quite the yak shaving:
1. I wanted to use `@layer` in a #CSS demo (ironically one showing that it doesn't solve this particular use case).
2. My auto #CSP setup using #JSDom and #CleanCSS failed to parse `@layer`.
3. I upgraded #CleanCSS.
4. I removed #JSDom and replaced it with #parse5, which works with `@layer`.
5. I wanted to use `Object.groupBy` here which requires `target: "ES2024"` in #TypeScript.
6. Therefore I needed to upgrade TS.
7. Upgrading TS broke #Karma for reasons I couldn't understand.
8. Therefore I migrated from Karma to #Vitest (which I've wanted to do anyways).
9. Now #Netlify is confused that I have both an 11ty and Vite project and fails, asking me to pick one.
10. I pick one in `netlify.toml`, but a bug in Netlify refuses to accept it. -
Over the last few days while working on an upcoming blog post I've performed quite the yak shaving:
1. I wanted to use `@layer` in a #CSS demo (ironically one showing that it doesn't solve this particular use case).
2. My auto #CSP setup using #JSDom and #CleanCSS failed to parse `@layer`.
3. I upgraded #CleanCSS.
4. I removed #JSDom and replaced it with #parse5, which works with `@layer`.
5. I wanted to use `Object.groupBy` here which requires `target: "ES2024"` in #TypeScript.
6. Therefore I needed to upgrade TS.
7. Upgrading TS broke #Karma for reasons I couldn't understand.
8. Therefore I migrated from Karma to #Vitest (which I've wanted to do anyways).
9. Now #Netlify is confused that I have both an 11ty and Vite project and fails, asking me to pick one.
10. I pick one in `netlify.toml`, but a bug in Netlify refuses to accept it. -
Ignoring JSDOM Errors in Vitest
When ignoring a problem becomes such a problem itself that you can no longer ignore it #tdd #jsdom #vitest
https://www.closingtags.com/ignoring-jsdom-errors-in-vitest/
-
👨💻 I'm building an app with as little #JavaScript as possible (only sending and receiving push notifications). I don't use any framework, and everything else is handled by the server.
❓ Now I'm wondering how to handle #testing. Does it make sense to do #UnitTesting for a few lines of JavaScript? How do you handle that? Do you only do #E2ETesting in such cases?
💭 I was already thinking about using #JSDom in #Jest, but the #HTML is generated by #Symfony, making it hard to get it in there…
-
@develwithoutacause @eliajf #Jest is definitely the industry standard, and has a lot of backing behind it - great interactive CLI and works great with tools like #testing-library and #jsdom - would definitely recommend checking that option out!
-
Has anyone built a "headless browser" that can be bundled with a CLI tool?
I'm thinking jsdom (but probably built with Rust + WASM). Something that can render websites and execute JavaScript, but is super small doesn't ship any window chrome or keyboard input support etc?
Asking because someone managed to compile SpiderMonkey to Webassembly. https://github.com/bytecodealliance/spidermonkey-wasm-build 😍
