bug: cannot pass a function as props in e2e test

[suatbayrak]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

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

[christian-bromann]

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.