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

bug: cannot pass a function as props in e2e test #6049

Open
3 tasks done
suatbayrak opened this issue Nov 19, 2024 · 1 comment
Open
3 tasks done

bug: cannot pass a function as props in e2e test #6049

suatbayrak opened this issue Nov 19, 2024 · 1 comment
Labels
Bug: Validated This PR or Issue is verified to be a bug within Stencil Help Wanted

Comments

@suatbayrak
Copy link

Prerequisites

Stencil Version

4.7.0

Current Behavior

I cant pass a function as props in e2e tests.

Expected Behavior

it should take function as props and should have been called at least once.

System Info

No response

Steps to Reproduce

  1. have a component with prop defined as a function
  2. use $eval to pass the mock function in e2e tests with puppetry
  3. function would not be passed and would not be called at least once

Code Reproduction URL

https://github.com/suatbayrak/stencilbug

Additional Information

I also I really want stencil team to integrate something like template: () => <custom-button></custom-button> just like we have in unit tests.
There was also a issue about this and its just closed
#2053

@ionitron-bot ionitron-bot bot added the triage label Nov 19, 2024
@christian-bromann christian-bromann added Bug: Validated This PR or Issue is verified to be a bug within Stencil Help Wanted and removed triage labels Nov 20, 2024
@christian-bromann
Copy link
Member

Thanks for raising the issue @suatbayrak this indeed looks a bit strange. We welcome any contributions that help resolve the problem.

We have been working on providing alternative testing solutions for running component tests on Stencil components. For example can you test the given component using WebdriverIO in a similar way as requested:

import { expect } from '@wdio/globals'
import { render } from '@wdio/browser-runner/stencil'

import MyNameComponent from './components/Component.tsx'

describe('Stencil Component Testing', () => {
    it('should render component correctly', async () => {
        await render({
            components: [MyNameComponent],
            template: () => (
                <my-name name={'stencil'} onClick={() => console.log('Hello World'); }></my-name>
            )
        })
        await expect($('.text')).toHaveText('Hello! My name is Stencil.')
    })
})

I believe similar things should be possible with Playwrigth as well. You can find more information on testing with WebdriverIO or Playwrigth in the Stencil docs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug: Validated This PR or Issue is verified to be a bug within Stencil Help Wanted
Projects
None yet
Development

No branches or pull requests

2 participants