nuxt3-class-component icon indicating copy to clipboard operation
nuxt3-class-component copied to clipboard

Using nuxt3-class-component in Jest tests

Open dubst3pp4 opened this issue 8 months ago • 0 comments

At first thanks for this module. We're currently migrating a Nuxt2 app to Nuxt3, and as we're using the nuxt-property-decorator with class components, we're now able to use our components in Nuxt3 thanks to your module.

Unfortunately it doesn't work in our component tests using Jest. When Jest runs the component tests, the following errors occurs:

 FAIL  test/components/shared/CustomFieldForm.test.ts  
  ● Test suite failed to run
  
    Cannot find module 'nuxt-property-decorator' from 'components/shared/CustomFieldForm.vue'         

    Require stack:     
      components/shared/CustomFieldForm.vue                                                                                                                                                  
      test/components/shared/CustomFieldForm.test.ts                                                                                                                                         
                                                                                                                                                                                             
      176 |    * whether the component is in readonly mode or not 
      177 |    */ 
    > 178 |   @Prop({ 
          |
      179 |     default: false,
      180 |     type: Boolean                              
      181 |   }) 
                                         
      at Resolver._throwModNotFoundError (node_modules/jest-resolve/build/resolver.js:427:11)       
      at Object.<anonymous> (components/shared/CustomFieldForm.vue:178:33)                
      at Object.<anonymous> (test/components/shared/CustomFieldForm.test.ts:35:1)

I can assume that this errors happens, as the tests are not running in the Nuxt context. As you wrote:

Unlike the original nuxt-property-decorator, this package is implemented as a Nuxt module. This is because it uses defineNuxtComponent internally, which doesn't work outside of Nuxt compilation context.

Are you aware of a way to setup Jest so that I can also use the functionality in the component tests?

dubst3pp4 avatar Oct 18 '23 12:10 dubst3pp4