Home  >  Q&A  >  body text

Register global custom directives for cypress component testing in vue

Is there a way to register global custom directives for cypress component testing in vue.js. Just register

app.directive('some',(el,binding)=>{{...})
The problem cannot be solved in the

main.js file. Because the directive could not be parsed in the component test component.

Local register like this:

mount(SomeComp,{
directive:{
  'some': {...}
})

is not a good choice. Because I'm using this directive in every component and it needs to be registered locally in every component.

How do I register global directives for Cypress component testing?

Thanks

P粉529581199P粉529581199229 days ago477

reply all(1)I'll reply

  • P粉884667022

    P粉8846670222024-03-27 12:13:02

    Create your own mount,

    import { mount } from '@cypress/vue'
    
    export const mountWithDirective = (myComponent) => {
    
      return mount(myComponent, {
        directive:{
          'some': {...}
      })
    }
    

    Put this into /cypress/support/index.js or another file of your choice.

    // test
    import { mountWithDirective } from 'cypress/support'
    import Component from './Component.vue'
    
    it...
      mountWithDirective(Component)
    

    reply
    0
  • Cancelreply