Without vue-portal all the oddities vanish

CC @Tirokk @mattwr18 @appinteractive

Major breakthrough: If I remove `vue-portal` entirely from the
styleguide, problem solved. Not only that we can remove the TODOs from
the tests. Even wrappers of subcomponents get updated when I interact
with the root component. What a bliss 😂

Example code:
```js
let button = wrapper.find('div div div button')
expect(button.attributes()).toEqual({disabled: 'disabled'})
wrapper.doSomeAction()
expect(button.attributes()).toEqual({})
```
This commit is contained in:
Robert Schäfer 2019-03-09 01:58:00 +01:00
parent 2831af469a
commit 525da7a303

View File

@ -50,12 +50,6 @@ describe('ReportModal.vue', () => {
return mount(ReportModal, { store, mocks, localVue })
}
beforeEach(() => {
// TODO find out why on earth do we have to call Wrapper() at least twice?
// TODO this is a nasty side effect and we have non-atomic tests here
Wrapper()
})
it('renders', () => {
expect(Wrapper().is('div')).toBe(true)
})
@ -71,16 +65,6 @@ describe('ReportModal.vue', () => {
wrapper = Wrapper()
})
describe('by default', () => {
it('buttons enabled', () => {
const expected = { disabled: 'disabled' }
const cancelButton = wrapper.findAll('footer button').at(0)
const confirmButton = wrapper.findAll('footer button').at(1)
expect(cancelButton.attributes().disabled).toBeUndefined()
expect(confirmButton.attributes().disabled).toBeUndefined()
})
})
describe('click confirm button', () => {
const clickAction = () => {
const confirmButton = wrapper.find('.ds-button-danger')
@ -96,14 +80,11 @@ describe('ReportModal.vue', () => {
it('disables buttons', () => {
const expected = { disabled: 'disabled' }
// TODO: `wrapper.findAll` behaves in a very odd way
// if I call find or findAll first to check the initial attributes
// the attributes won't change anymore. Seems to be a caching
// problem here. I made a workaround by checking the inital
// in a separate test case above.
let cancelButton = wrapper.findAll('footer button').at(0)
let confirmButton = wrapper.findAll('footer button').at(1)
expect(cancelButton.attributes().disabled).toBeUndefined()
expect(confirmButton.attributes().disabled).toBeUndefined()
clickAction()
const cancelButton = wrapper.findAll('footer button').at(0)
const confirmButton = wrapper.findAll('footer button').at(1)
expect(cancelButton.attributes()).toEqual(
expect.objectContaining(expected)
)