D
Deno

help

Component testing with Deno

Llim11/3/2023
I've run through a zillion possible setups with Deno and I'm still struggling to understand exactly how to do this. I want to write Typescript that transpiles to vanilla web components and I want to run associated unit tests in a component.test.ts that sits beside my component in a folder. I want these unit tests to be able to spin up a dom to test things like saving to localStorage. And I want this to be as simple and minimal as possible. I've explored just writing everything from scratch with Deno, and I couldn't quite grasp how to get esbuild to output my components as separate modules and it looked like I'd have to basically write my own build scripts, like the pre-Gulp days. I have installed vite and tried out vite vanilla, vite-lit, and vite-svelte. I thought vite-svelte was my saviour but again I just couldn't get the testing working. When I tried to install vitest I kept hitting this error: Error: Vitest was initialised with native Node instead of Vite Node and could progress no further. Does anyone know of a tutorial or starter kit that has testing set up properly? That isn't hugely elaborate or very outdated?
DAHDeno AI Helper11/3/2023
I understand your struggle with setting up a testing environment for your web components with Deno. However, based on the documentation, there isn't a specific guide or tutorial that directly addresses your scenario of testing web components with Deno. The documentation does provide a general guide on how to write tests in Deno. For instance, you can use the Deno.test() function to define your tests and then run them using the deno test command. Here's a basic example from the documentation:
// mod_test.ts
import { assertEquals } from "https://deno.land/std@0.192.0/testing/asserts.ts";
import { is42 } from "./mod.ts";

Deno.test("42 should return true", () => {
assertEquals(true, is42(42));
});

Deno.test("1 should return false", () => {
assertEquals(false, is42(1));
});
// mod_test.ts
import { assertEquals } from "https://deno.land/std@0.192.0/testing/asserts.ts";
import { is42 } from "./mod.ts";

Deno.test("42 should return true", () => {
assertEquals(true, is42(42));
});

Deno.test("1 should return false", () => {
assertEquals(false, is42(1));
});
You can run the tests with deno test. However, this doesn't cover the specifics of testing web components or using a DOM environment for testing. For more complex scenarios like yours, you might need to look into third-party libraries or tools that can provide a DOM-like environment for testing in Deno. However, the documentation does not provide specific recommendations or examples for this. I'm sorry I couldn't provide a more direct solution to your problem. It might be helpful to ask this question in Deno's community forums or on Stack Overflow, where other developers might have faced similar challenges. 🦕
Llim11/3/2023
I have asked ChatGPT already, of course. And read the docs! I'm asking a specific question
Ccdoremus11/4/2023
Craig's Deno Diary
Craig's Deno Diary is a blog that covers the JavaScript and TypeScript runtime Deno and focuses on how to write Deno programs and use Deno libraries.
Llim11/4/2023
Thanks. I really appreciate you taking the time to respond! <3 The thing is I'm really not looking to use Fresh. I need to write web components. If I had my druthers I'd just write plain web components but I am required to use Typescript, so this led me to Svelte as this will export to wc. I couldn't get esbuild to build me individual modules in deno. I don't know why I swallowed the fly. I've gone back to Node :/

Looking for more? Join the community!

Recommended Posts
Is there any way to run deno as a cluster on one machine? (like pm2)I plan to service with deno, but PM2 does NOT support deno. Is there any way to run deno as a clusthow to set remoteAddr from http header Forwarded for or X-Forwarded forIn some environments are the TCP Client IP not the real Client IP. What's the best way to set https:FFI: How to pass a pointer to a char pointer?How can I pass a pointer to a char pointer in order to use the C function below via FFI? ```c my_funDeno.serve().shutdown doesn't exist?```ts const server = Deno.serve({ hostname, port, }) server.shutdown() ``` ``` error: TS2339 [EDeno deploy see errorHow can i see the error why my build failed? It just returned `Error An internal server error occurrIn-browser testingI need to run some tests in a browser (Chrome, Firefox, Safari). Either by running a full test suiteCannot pass request object to workerI am trying to pass a request object to a worker file, but it is not receiving it inside of the workDoes the picture plugin for lume work with remote Images?I want to use the picture plugin with images that are from a remote location. Is there a way to get problem with prompt on windowsHi, I'm experiencing trouble when inputting 2 char long strings in prompt, it's doing \rDuplicate tailwind classes in Fresh projectAcross the board I'm seeing tailwind classes duplicated in my Fresh project. There doesn't seem to bTrouble accessing Deno KV via the Deno CLII'm trying to connect to a Deno KV via the CLI with the following simple code: ```ts //main.ts consBest way for application config in deno/ts?Hi. I'm alex and quite new to deno/typescript. Thank you for the quite big documenation it is a quitError trying to connect: Connection reset by peer (os error 104)Hello, i'm trying to deploy a my Fresh website using a Ubuntu 22.04 server but when I try to run my 500 on deno.land/x/fp_ts with ?s=eitherThe actual URL is https://deno.land/x/fp_ts@v2.11.4/mod.ts?s=either