Support for Svelte Actions?

[gossi]

I was about implementing a svelte action to make my universal lib available in svelte. Implementing the action would be straight forward. Then I thought how would I test this? Coming from ember where the testing is broadly covered, I felt lost in svelte land. I test my universal lib in vitest with browser mode already and would love to continue using that for svelte, too.

So I come across this fresh project here which is only a week old, but probably exactly what I am looking for.

I see you can already test svelte component, seems the best to start with. I was wondering if you plan on providing a way to test html + an action?

PS. Also asking this for its sister project vitest-browser-vue (where in vue, this would be a directive).

[sheremet-va]

By "actions" do you mean SvelteKit actions?

[gossi]

I was referring to svelte actions (sorry my bad, I didn't left a link).

[sheremet-va]

The testing library approach promotes testing the use case instead of the implementation, so I don't think it's a good idea to provide an API to bypass that. You should create a component that uses the action and test the user behaviour.

[gossi]

Actually, it is meant with html in the first place. It may be wrapped in a component.

Wrapping it in a component is what I consider a hacky workaround (or as people say handing me the hammer because the problem has been turned into a nail). Coming from ember where things are considered more distinctively, I notice this as missing.

To vizualize what I mean, here is a testing code I would want to write (in pseudo-ish code):

import { page } from '@vitest/browser/context'
import { listbox } from 'aria-voyager-svelte'

test('listbox does work', async () => {
  // arrange
  const screen = page.render(
    <template>
      <div role="listbox" use:listbox>
        <span role="option">Ananas</span>
        <span role="option">Banana</span>
        <span role="option">Pear</span>
      </div>
    </template>
  )

  // act

  // assert

  // cleanup

  screen.cleanup()
})

[sheremet-va]

Actually, it is meant with html in the first place. It may be wrapped in a component.

I don't see how this is a workaround. It is meant to be part of HTML in the Svelte component since it requires Svelte to function. It might even require a svelte extension to be processed correctly.

I think adding any workarounds might break the intended behaviour, so I would oppose adding support for this