vite-plugin-vue icon indicating copy to clipboard operation
vite-plugin-vue copied to clipboard

Edit isCustomElement filtering during vitest runtime

Open wassim-ben-amor opened this issue 2 years ago • 0 comments

Related plugins

Description

Using Vitest based on vite config, when using for example:

    vue({
      customElement: true,
      template: {
        compilerOptions: {
          isCustomElement: tag => tag.includes('-'),
        },
      },
    }),

I want to be able to edit the isCustomElement filtering during the test run. In fact, when testing web components using vue test utils, there are 2 scenarios: 1- If isCustomElement is set to true on this webcomponent, we can no more apply a stub on it as it is totally ignored. But we can still do wrapper.find(...).trigger('customEvent', { detail: 'HelloWorld' }) 2- If isCustomElement is set to false on this webcomponent, it's possible to createa stub for this component, but without creating a stub It is no more possible to trigger custom events, as we can only trigger DOM events, for example click, submit or keyup but no custom events.

Suggested solution

During the test case, before launching the mount(). If we have the ability to change the isCustomElement filtering. We can decide which scenario we can apply: 1- no stubs but ability to fire custom events 2- stubs but no ability to fire custom events

Alternative

I didn't find any alternative to have all the possibilities: Ability to stub the webcomponent & Ability to fire custom events

Additional context

No response

Validations

wassim-ben-amor avatar Nov 03 '23 11:11 wassim-ben-amor