Skip to content

Conversation

@paulpflug
Copy link

adds the possibility to add unit tests to the vue file - to keep together what belongs together

This is rather large. A short overview of the content:

missing: documentation - I'm willing to provide these if this gets accepted.

example for testing a unmounted component:

<script>
module.exports = {
  data () {
    return {
      msg: 'Hello from Component A!'
    }
  }
}
</script>
<template>
  <h2 class="red">{{msg}}</h2>
</template>

<style>
comp-a h2 {
  color: #f00;
}
</style>

<script test>
var module = window.vueTestComp
var styles = window.document.querySelectorAll('style')
var style = styles[styles.length-1].textContent
describe("vue-loader", function () {
  it('basic', function () {
    expect(module.template).to.contain('<h2 class="red">{{msg}}</h2>')
    expect(module.data().msg).to.contain('Hello from Component A!')
    expect(style).to.contain('comp-a h2 {\n  color: #f00;\n}')
  })
})
</script>

example for testing a mounted component:

<template>
  <h2 class="red">{{msg}}</h2>
</template>

<script>
module.exports = {
  data () {
    return {
      msg: 'Hello from Component A!'
    }
  }
}
</script>

<script test="karma">
var module = window.vueTestComp
describe("vue-loader", function () {
  it('karma', function () {
    expect(module.$el).to.exist
    expect(module.msg).to.contain('Hello from Component A!')
  })
  after(function () {
    module.$destroy(true)
  })
})
</script>

@yyx990803
Copy link
Member

Hey, thanks for the PR! Ideally we should split changes into separate, smaller PRs each addressing one problem so they are easier to review and merge. Big PRs like this involve too many moving parts to be merged in one go.

@paulpflug
Copy link
Author

splitted in 3 PR

@paulpflug paulpflug closed this May 26, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants