Skip to content

Commit b3bf00d

Browse files
simplesmilerAkryum
simplesmiler
authored and
Akryum
committed
fix: Remember initial mutations (#723)
* fix: remember initial mutations * chore: fix ci * chore: fix ci * chore: fix ci * test: fix e2e * test: fix e2e for real :D
1 parent 019759b commit b3bf00d

File tree

12 files changed

+264
-54
lines changed

12 files changed

+264
-54
lines changed

‎cypress/integration/components-tab.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { suite } from '../utils/suite'
22

3-
const baseInstanceCount = 9
3+
const baseInstanceCount = 10
44

55
suite('components tab', () => {
66
it('should detect instances inside shadow DOM', () => {

‎cypress/integration/vuex-edit.js

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,10 @@ import { suite } from '../utils/suite'
33
suite('vuex edit', () => {
44
it('should edit state using the decrease button', () => {
55
cy.get('.vuex-tab').click()
6+
cy.get('[data-id="load-vuex-state"]').click()
7+
68
// using the decrease button
7-
cy.get('.data-field').eq(0)
9+
cy.get('.state .data-field').eq(0)
810
.find('.actions .vue-ui-button').eq(1)
911
.click({ force: true })
1012
.click({ force: true })
@@ -17,7 +19,7 @@ suite('vuex edit', () => {
1719

1820
it('should edit state using the increase button', () => {
1921
// using the increase button
20-
cy.get('.data-field').eq(0).click()
22+
cy.get('.state .data-field').eq(0).click()
2123
.find('.actions .vue-ui-button').eq(2)
2224
.click({ force: true })
2325
.click({ force: true })
@@ -30,7 +32,7 @@ suite('vuex edit', () => {
3032

3133
it('should edit state using the edit input', () => {
3234
// using the edit input
33-
cy.get('.data-field').eq(0).click()
35+
cy.get('.state .data-field').eq(0).click()
3436
.find('.actions .vue-ui-button').eq(0).click({ force: true })
3537
cy.get('.edit-input').type('12')
3638
cy.get('.edit-overlay > .actions > :nth-child(2) > .content > .vue-ui-icon').click()
@@ -40,8 +42,8 @@ suite('vuex edit', () => {
4042
get('#counter p').contains('12')
4143
})
4244

43-
// change count back to 0
44-
cy.get('.data-field').eq(0).click()
45+
// change count back to 1
46+
cy.get('.state .data-field').eq(0).click()
4547
.find('.actions .vue-ui-button').eq(0).click({ force: true })
4648
cy.get('.edit-input').type('0')
4749
cy.get('.edit-overlay > .actions > :nth-child(2) > .content > .vue-ui-icon').click()

‎cypress/integration/vuex-tab.js

Lines changed: 26 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,15 @@ suite('vuex tab', () => {
1010
get('#counter p').contains('1')
1111
})
1212
cy.get('.vuex-tab').click()
13-
cy.get('.history .entry').should('have.length', 4)
13+
cy.get('.history .entry').should('have.length', 5)
1414
cy.get('[data-id="load-vuex-state"]').click()
1515
cy.get('.recording-vuex-state').should('not.be.visible')
1616
cy.get('.loading-vuex-state').should('not.be.visible')
1717
cy.get('.vuex-state-inspector').then(el => {
1818
expect(el.text()).to.include('type:"DECREMENT"')
1919
expect(el.text()).to.include('count:1')
2020
})
21-
cy.get('.history .entry').eq(3).should('have.class', 'inspected').should('have.class', 'active')
21+
cy.get('.history .entry').eq(4).should('have.class', 'inspected').should('have.class', 'active')
2222
})
2323

2424
it('should filter state & getters', () => {
@@ -41,7 +41,7 @@ suite('vuex tab', () => {
4141
cy.get('.history .entry[data-active="true"].active').should('have.length', 0)
4242

4343
cy.get('.left .search input').clear().type('/dec)/i')
44-
cy.get('.history .entry[data-active="true"]').should('have.length', 3)
44+
cy.get('.history .entry[data-active="true"]').should('have.length', 4)
4545
cy.get('.history .entry[data-active="true"].inspected').should('have.length', 0)
4646
cy.get('.history .entry[data-active="true"].active').should('have.length', 1)
4747

@@ -65,19 +65,19 @@ suite('vuex tab', () => {
6565
})
6666

6767
it('should time-travel', () => {
68-
cy.get('.history .entry[data-index="2"] .entry-actions .action-time-travel').click({ force: true })
69-
cy.get('.history .entry[data-index="2"]')
68+
cy.get('.history .entry[data-index="3"] .entry-actions .action-time-travel').click({ force: true })
69+
cy.get('.history .entry[data-index="3"]')
7070
.should('have.class', 'inspected')
7171
.should('have.class', 'active')
7272
cy.get('#target').iframe().then(({ get }) => {
7373
get('#counter p').contains('2')
7474
})
7575

76-
cy.get('.history .entry[data-index="1"] .mutation-type').click({ force: true })
77-
cy.get('.history .entry[data-index="1"]')
76+
cy.get('.history .entry[data-index="2"] .mutation-type').click({ force: true })
77+
cy.get('.history .entry[data-index="2"]')
7878
.should('have.class', 'inspected')
7979
.should('not.have.class', 'active')
80-
cy.get('.history .entry[data-index="2"]')
80+
cy.get('.history .entry[data-index="3"]')
8181
.should('not.have.class', 'inspected')
8282
.should('have.class', 'active')
8383
cy.get('.recording-vuex-state').should('not.be.visible')
@@ -90,11 +90,11 @@ suite('vuex tab', () => {
9090
cy.get('#target').iframe().then(({ get }) => {
9191
get('#counter p').contains('2')
9292
})
93-
cy.get('.history .entry[data-index="1"] .entry-actions .action-time-travel').click({ force: true })
94-
cy.get('.history .entry[data-index="1"]')
93+
cy.get('.history .entry[data-index="2"] .entry-actions .action-time-travel').click({ force: true })
94+
cy.get('.history .entry[data-index="2"]')
9595
.should('have.class', 'inspected')
9696
.should('have.class', 'active')
97-
cy.get('.history .entry[data-index="2"]')
97+
cy.get('.history .entry[data-index="3"]')
9898
.should('not.have.class', 'inspected')
9999
.should('not.have.class', 'active')
100100
cy.get('#target').iframe().then(({ get }) => {
@@ -112,8 +112,8 @@ suite('vuex tab', () => {
112112
cy.get('#target').iframe().then(({ get }) => {
113113
get('#counter p').contains('1')
114114
})
115-
cy.get('.history .entry[data-index="0"] .entry-actions .action-time-travel').click({ force: true })
116-
cy.get('.history .entry[data-index="0"]')
115+
cy.get('.history .entry[data-index="1"] .entry-actions .action-time-travel').click({ force: true })
116+
cy.get('.history .entry[data-index="1"]')
117117
.should('have.class', 'inspected')
118118
.should('have.class', 'active')
119119
cy.get('#target').iframe().then(({ get }) => {
@@ -122,10 +122,10 @@ suite('vuex tab', () => {
122122
})
123123

124124
it('should revert', () => {
125-
cy.get('.history .entry[data-index="3"] .mutation-type').click({ force: true })
126-
cy.get('.history .entry[data-index="3"]').find('.action-revert').click({ force: true })
127-
cy.get('.history .entry[data-active="true"]').should('have.length', 3)
128-
cy.get('.history .entry[data-index="2"]')
125+
cy.get('.history .entry[data-index="4"] .mutation-type').click({ force: true })
126+
cy.get('.history .entry[data-index="4"]').find('.action-revert').click({ force: true })
127+
cy.get('.history .entry[data-active="true"]').should('have.length', 4)
128+
cy.get('.history .entry[data-index="3"]')
129129
.should('have.class', 'inspected')
130130
.should('have.class', 'active')
131131
cy.get('.vuex-state-inspector').then(el => {
@@ -137,8 +137,7 @@ suite('vuex tab', () => {
137137
})
138138

139139
it('should commit', () => {
140-
cy.get('.history .entry[data-index="2"] .mutation-type').click({ force: true })
141-
cy.get('.history .entry[data-index="2"] .action-commit').click({ force: true })
140+
cy.get('.history .entry[data-index="3"] .action-commit').click({ force: true })
142141
cy.get('.history .entry[data-active="true"]').should('have.length', 1)
143142
cy.get('.history .entry[data-index="0"]')
144143
.should('have.class', 'inspected')
@@ -152,20 +151,23 @@ suite('vuex tab', () => {
152151
})
153152

154153
it('should display getters', () => {
155-
cy.get('.vuex-state-inspector').then(el => {
156-
expect(el.text()).to.include('isPositive:true')
154+
cy.get('.vuex-state-inspector').within(() => {
155+
cy.get('.key').contains('count').parent().contains('2')
156+
cy.get('.key').contains('isPositive').parent().contains('true')
157157
})
158158
cy.get('#target').iframe().then(({ get }) => {
159159
get('.decrement')
160160
.click({ force: true })
161161
.click({ force: true })
162162
.click({ force: true })
163+
get('#counter p').contains('-1')
163164
})
164165
cy.get('.history .entry[data-index="3"]').click({ force: true })
165166
cy.get('.recording-vuex-state').should('not.be.visible')
166167
cy.get('.loading-vuex-state').should('not.be.visible')
167-
cy.get('.vuex-state-inspector').then(el => {
168-
expect(el.text()).to.include('isPositive:false')
168+
cy.get('.vuex-state-inspector').within(() => {
169+
cy.get('.key').contains('count').parent().contains('-1')
170+
cy.get('.key').contains('isPositive').parent().contains('false')
169171
})
170172
})
171173

@@ -178,7 +180,7 @@ suite('vuex tab', () => {
178180
cy.get('#target').iframe().then(({ get }) => {
179181
get('.increment').click({ force: true })
180182
})
181-
cy.get('.history .entry').should('have.length', 4)
183+
cy.get('.history .entry').should('have.length', 5)
182184
})
183185

184186
it('should copy vuex state', () => {

‎shells/dev/target/Init.vue

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<template>
2+
<div id="init">
3+
<p>Inited: {{ inited }}</p>
4+
</div>
5+
</template>
6+
7+
<script>
8+
import { mapState } from 'vuex'
9+
10+
export default {
11+
computed: {
12+
...mapState({
13+
inited: state => state.inited
14+
})
15+
},
16+
created() {
17+
this.$store.commit('TEST_INIT')
18+
}
19+
}
20+
</script>

‎shells/dev/target/index.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import Vue from 'vue'
22
import store from './store'
33
import Target from './Target.vue'
44
import Other from './Other.vue'
5+
import Init from './Init.vue'
56
import Counter from './Counter.vue'
67
import VuexObject from './VuexObject.vue'
78
import NativeTypes from './NativeTypes.vue'
@@ -39,7 +40,8 @@ new Vue({
3940
h(Events, { key: 'foo' }),
4041
h(NativeTypes, { key: new Date() }),
4142
h(Router, { key: [] }),
42-
h(VuexObject)
43+
h(VuexObject),
44+
h(Init)
4345
])
4446
}
4547
}).$mount('#app')

‎shells/dev/target/store.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ Vue.use(Vuex)
55

66
export default new Vuex.Store({
77
state: {
8+
inited: 0,
89
count: 0,
910
date: new Date(),
1011
set: new Set(),
@@ -21,6 +22,7 @@ export default new Vuex.Store({
2122
}
2223
},
2324
mutations: {
25+
TEST_INIT: state => state.inited++,
2426
INCREMENT: state => state.count++,
2527
DECREMENT: state => state.count--,
2628
UPDATE_DATE: state => {

0 commit comments

Comments
 (0)