Error when running test with vitest + vue3 + vite on component that has a Syncfusion Dialog

[Jordan Polaniec]

Hello,

I'm seeing the following error when running a unit test on a custom component that has a Syncfusion Dialog inside it.

Error:

FAIL src/components/__tests__/TheWelcome.spec.js [ src/components/__tests__/TheWelcome.spec.js ]

TypeError: Right-hand side of 'instanceof' is not callable

❯ o node_modules/@syncfusion/ej2-vue-base/dist/ej2-vue-base.umd.min.js:28:1565

❯ node_modules/@syncfusion/ej2-vue-base/dist/ej2-vue-base.umd.min.js:28:6347

❯ i node_modules/@syncfusion/ej2-vue-popups/dist/ej2-vue-popups.umd.min.js:37:1058

❯ node_modules/@syncfusion/ej2-vue-popups/dist/ej2-vue-popups.umd.min.js:37:1257

❯ node_modules/@syncfusion/ej2-vue-popups/dist/ej2-vue-popups.umd.min.js:37:1291

❯ node_modules/@syncfusion/ej2-vue-popups/dist/ej2-vue-popups.umd.min.js:37:69

❯ Object. node_modules/@syncfusion/ej2-vue-popups/dist/ej2-vue-popups.umd.min.js:37:390

Is Vitest + Vue3 + Vite a supported configuration for unit tests with Syncfusion?

Here is a repository with a demo to reproduce the error:

https://github.com/Frannsoft/vitest-vite-vue-syncfusion-question

To run unit tests, the 'npm run test:unit' command can be used.

Thanks for your time.

[Kalaivannan Ganesan]

Hi Jordan,

We have tried to run the shared sample, but we are getting some errors while trying to run the unit tests using the 'npm run test:unit' command. Please refer to the error screenshot below,

So can you please share us with the runnable issue replicating sample or please provide the node and npm versions to run this sample at our end.

Regards,

Vinitha

[Jordan Polaniec]

Hello,

There are several versions of node that can be used. I would recommend node 16, but node 18 would also work:

https://github.com/vitejs/vite/issues/9113#issuecomment-1184319357

Thank you and please let me know if have any more questions.

Best,

Jordan

[Vinitha Jeyakumar]

Hi Jordan,

Currently, we are validating your reported query. we will update you the further details on or before 12th August 2022.

Regards,

Vinitha

[Jordan Polaniec]

Hello,

Checking in and seeing if there's an update on this.

Best,

Jordan

[Vinitha Jeyakumar]

Hi Jordan,

Sorry for the inconvenience caused,

We are facing more complexity in validating the reported issue. we will update you the further details on or before 17^th August 2022.

Regards,

Vinitha

[Jordan Polaniec]

Hello,

Just checking in and seeing if there's an update on this.

Best,

Jordan

[Jordan Polaniec]

Hello,

Just checking in and seeing if there's an update on this.

Best,

Jordan

[Jordan Polaniec]

Hello,

Just checking in and seeing if there's an update on this.

Best,

Jordan

[Ragunath Sukumaran]

Hi Jordan,

Sorry for the inconvenience caused,

We are facing more complexity in validating the reported issue. we will update you the further details on or before 1st September 2022.

Regards,

Ragunath S

[Jordan Polaniec]

Hello,

Just checking in and seeing if there's an update on this.

Best,

Jordan

[Ragunath Sukumaran]

Hi Jordan,

Sorry for the inconvenience caused.

In the vite testing, the vite is taking the umd file of the Syncfusion components but our Syncfusion components umd file has some issues with the vite testing. We have logged a feature request for proving our components to support vite testing. For now, we have prepared a work around utility to change the umd file reference in the vite testing process. Please follow the below steps to utilize this utility.

Utility Script: https://www.syncfusion.com/downloads/support/directtrac/general/ze/syncfusion-vite-test-21028499

1. Download the script file given the above link.
2. Place script file “syncfusion-vite-test.js” which is download from the link in the path relative to the package.json file.

3. Refer this script file with the test:unit in the scripts method “node syncfusion-vite-test.js && vitest --environment jsdom” in the package.json file like the below screenshot.
   
   

4. Run the “npm run test:unit” command. The issue you are facing will be resolved.

We have added this in your shared sample. Please refer to the below sample.

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/vite-test32193474

Please get back to us if you have any queries.

Regards,

Ragunath S

[Jordan Polaniec]

Hello,

Thank you, this helps.

Would you be able to provide a link to the Feature Request so I can follow it?

Best,

Jordan

[Ragunath Sukumaran]

Hi Jordan,

Please refer to the below feedback link to track the status of this feature.

https://www.syncfusion.com/feedback/37653/need-to-provide-support-for-our-vue-3-controls-to-the-vite-testing

Please get back to us if you have any queries.

Regards,
Ragunath S