wrapper.find is not working for avoriaz

Question

I am using avoriaz for testing in vuejs . Here is my code for testing and components.

<template>
<v-container fluid class="login-container">
    <div class="hyperlogo">
      <center>
        <img src='../../../assets/logo.png' height="100" width="100">
        <p>HyperEmail</p>
        <a>v0.11.1</a>
      </center>
    </div>
    <v-layout row wrap>
      <v-flex xs6 md4 offset-md4>
        <v-card class="login-card">
            <v-card-text class="login-text">
              <v-text-field
                v-on:focus="focusUser"
                label="Username"
                placeholder="Username"
                class="mt-5"
                v-model="username"
                @keyup.enter.native="validateData"
                v-bind:rules="[userNameError]"
              ></v-text-field>
              <v-text-field
                v-on:focus="focusPassword"
                label="Password"
                placeholder="Password"
                v-model="password"
                type="password"
                v-on:keyup.enter.native="validateData"
                v-bind:rules="[passwordError]"
              ></v-text-field>
            </v-card-text>
            <div @click="validateData" class="button-style">
              <v-btn block primary light >Login</v-btn>
            </div>
          </v-card>
      </v-flex>
      <Error v-if="error" :text="error.msg" :onDestroy="resetError" />
    </v-layout>
  </v-container>
</template>

For testing

import Login from '@/containers/views/login/Login.vue'


  describe('Login.vue', () => {
  it('checks text inside login component', () => {
    const wrapper = mount(Login)
    // let parent = wrapper.find('.hyperlogo')[0]
    // expect(wrapper.contains('.hyperlogo')).to.equal(true)
    if (wrapper.find('.hyperlogo')[0]) {
      console.log('Yes it is there')
    }
    expect(wrapper.text()).to.equal('')
    expect(wrapper.find('center')[0].is('center')).to.equal(true)
  })
})

Here wrapper.find is not working Error : - TypeError: Cannot read property 'is' of undefined .. Can anyone helps me to solve this type of error ??

Is avoriaz finding the DOM node with the `hyperlogo` CSS class? — Nathan Wailes, Jul 08 '17 at 09:19
Can you include in your question the code that actually loads the `Login.vue` file into the `Login` variable? And can you include enough of your project structure so that we can see where this test file is relative to `Login.vue`? — Nathan Wailes, Jul 08 '17 at 09:46
This is the structure for the component src/containers/views/login/Login.vue and this is for test file test/unit/specs/menus.spec.js both are under my project file — praneet drolia, Jul 08 '17 at 09:52
From the symptoms you're describing, it seems like your component may not be getting imported. What happens if you remove the `@` from your import statement in your test file and instead use a relative path (so, something like `import Login from '../../../../src/containers/views/login/Login.vue'`)? And can you include in your question [the part of your config where you define the `@` alias](https://stackoverflow.com/a/44251999/4115031)? — Nathan Wailes, Jul 08 '17 at 10:09
When I asked above, "Is avoriaz finding the DOM node with the `hyperlogo` CSS class?", what I meant was, is the console printing `'Yes it is there'`, as the code suggests it should be? — Nathan Wailes, Jul 08 '17 at 10:14
But when i am giving this expect(wrapper.vm.$options.data().username).to.equal('') it is returning true — praneet drolia, Jul 08 '17 at 10:16
i dont know how to select a particular tag or query in avoriaz — praneet drolia, Jul 08 '17 at 10:16
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/148676/discussion-between-nathan-wailes-and-praneet-drolia). — Nathan Wailes, Jul 08 '17 at 10:22
I ran this test with avoriaz 2.4.2 and it passed (after commenting out the text assertion). Are you calling Vue.use(Vuetify) before your test? — Edward, Jul 17 '17 at 06:58

wrapper.find is not working for avoriaz

0 Answers0