This repository has been archived by the owner on Dec 12, 2020. It is now read-only.
Full Vuex support with enhanced Counter.vue example and test spec #15
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
The inner Vue instance within Vuex Store must be refeshed by `resetStoreVM` to restore reactivity of the store state. This doesn’t fix stale mapped getters within components. That’s a separate WIP issue.
Current mapped vuex getters within components become stale. To have a working Counter example, the computed mapped `evenOrOdd` is accessed directly via `$store`. This will be changed back once the stale mapped getter issue (WIP) is fixed.
Added tests to cover all the features within the component. Fixes cypress-io#6
Refactors how the Vue instance within the component app frame is initialized, and fully fixes Vue integration. - fixes lingering issues after pull request cypress-io#13 - fully fixes cypress-io#6 - fixes #1 - README docs have been updated to reflect refactoring - 'vue' option has been deprecated (with warning to user) as it's no longer necessary - spread operator support has been added for upcoming Vuex example
To thoroughly demonstrate Vuex support after the refactoring in commit e8773383, Counter.vue now: - Utilizes all Vuex mapping functions. - Can properly use computed mapped getters in its template. This was an issue after cypress-io#13. - Set count state via an input field to demonstrate mapped mutations. Two tests have been added to the spec for this new input field. Close cypress-io#6
|
@bahmutov I'm interested to hear your initial feedback on this, because after this refactoring |
|
I have not looked at it yet, but I agree - we should have Vue as a peer dependency - because the user 100% has it already. I will change this repo to do this. |
bahmutov
reviewed
Jan 31, 2018
| 'node_modules/vue/dis/vue' is always used. | ||
| Please remove it from your 'mountVue' options.`) | ||
| } | ||
|
|
There was a problem hiding this comment.
nice touch - showing deprecation warning
There was a problem hiding this comment.
I'm all about smooth transitions from version to version.
|
I do see error messages when running counter example
But I ❤️❤️❤️ your work here, merging it in! |
bahmutov
added a commit
that referenced
this pull request
Jan 31, 2018
* working on Vuex example for #6 * fix: Vuex integration and add Counter example tests (#13) * fix: vuex integration (#6) The inner Vue instance within Vuex Store must be refeshed by `resetStoreVM` to restore reactivity of the store state. This doesn’t fix stale mapped getters within components. That’s a separate WIP issue. * fix: stale mapped getter `evenOrOdd` (#6) Current mapped vuex getters within components become stale. To have a working Counter example, the computed mapped `evenOrOdd` is accessed directly via `$store`. This will be changed back once the stale mapped getter issue (WIP) is fixed. * feat: added example tests for Counter component Added tests to cover all the features within the component. Fixes #6 * minor: following better practices * Full Vuex support with enhanced Counter.vue example and test spec (#15) * fix: vuex integration (#6) The inner Vue instance within Vuex Store must be refeshed by `resetStoreVM` to restore reactivity of the store state. This doesn’t fix stale mapped getters within components. That’s a separate WIP issue. * fix: stale mapped getter `evenOrOdd` (#6) Current mapped vuex getters within components become stale. To have a working Counter example, the computed mapped `evenOrOdd` is accessed directly via `$store`. This will be changed back once the stale mapped getter issue (WIP) is fixed. * feat: added example tests for Counter component Added tests to cover all the features within the component. Fixes #6 * minor: following better practices * fix: refactor Vue initialization in app frame Refactors how the Vue instance within the component app frame is initialized, and fully fixes Vue integration. - fixes lingering issues after pull request #13 - fully fixes #6 - fixes amirrustam#1 - README docs have been updated to reflect refactoring - 'vue' option has been deprecated (with warning to user) as it's no longer necessary - spread operator support has been added for upcoming Vuex example * feat: enhanced Vuex Counter example and test spec To thoroughly demonstrate Vuex support after the refactoring in commit amirrustam/cypress-vue-unit-test@e8773383, Counter.vue now: - Utilizes all Vuex mapping functions. - Can properly use computed mapped getters in its template. This was an issue after #13. - Set count state via an input field to demonstrate mapped mutations. Two tests have been added to the spec for this new input field. Close #6 * minor: remove redundant declaration
|
I'm on the case, and am investigating these warning message. But I'm glad the functionality is there now. I'm going to continue testing, improving, and polishing. I think this project is going to go a long way in making Cypress a one-stop-shop testing tool for Vue.js developers. Right now I'm putting it to test by testing every component in the popular Vuetify component framework. |
|
Perfect!
…Sent from my iPhone
On Jan 31, 2018, at 10:24, Amir Rustamzadeh ***@***.***> wrote:
I'm on the case, and am investigating these warning message. But I'm glad the functionality is there now.
I'm going to continue testing, improving, and polishing. I think this project is going to go a long way in making Cypress a one-stop-shop testing tool for Vue.js developers. Right now I'm putting it to test by testing every component in the popular Vuetify component framework.
—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub, or mute the thread.
|
JessicaSachs
pushed a commit
to cypress-io/cypress
that referenced
this pull request
Sep 29, 2020
* working on Vuex example for cypress-io/cypress-vue-unit-test#6 * fix: Vuex integration and add Counter example tests (cypress-io/cypress-vue-unit-test#13) * fix: vuex integration (bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6) The inner Vue instance within Vuex Store must be refeshed by `resetStoreVM` to restore reactivity of the store state. This doesn’t fix stale mapped getters within components. That’s a separate WIP issue. * fix: stale mapped getter `evenOrOdd` (bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6) Current mapped vuex getters within components become stale. To have a working Counter example, the computed mapped `evenOrOdd` is accessed directly via `$store`. This will be changed back once the stale mapped getter issue (WIP) is fixed. * feat: added example tests for Counter component Added tests to cover all the features within the component. Fixes bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6 * minor: following better practices * Full Vuex support with enhanced Counter.vue example and test spec (cypress-io/cypress-vue-unit-test#15) * fix: vuex integration (bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6) The inner Vue instance within Vuex Store must be refeshed by `resetStoreVM` to restore reactivity of the store state. This doesn’t fix stale mapped getters within components. That’s a separate WIP issue. * fix: stale mapped getter `evenOrOdd` (bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6) Current mapped vuex getters within components become stale. To have a working Counter example, the computed mapped `evenOrOdd` is accessed directly via `$store`. This will be changed back once the stale mapped getter issue (WIP) is fixed. * feat: added example tests for Counter component Added tests to cover all the features within the component. Fixes bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6 * minor: following better practices * fix: refactor Vue initialization in app frame Refactors how the Vue instance within the component app frame is initialized, and fully fixes Vue integration. - fixes lingering issues after pull request bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#13 - fully fixes bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6 - fixes amirrustam/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#1 - README docs have been updated to reflect refactoring - 'vue' option has been deprecated (with warning to user) as it's no longer necessary - spread operator support has been added for upcoming Vuex example * feat: enhanced Vuex Counter example and test spec To thoroughly demonstrate Vuex support after the refactoring in commit amirrustam/cypress-vue-unit-test@e8773383, Counter.vue now: - Utilizes all Vuex mapping functions. - Can properly use computed mapped getters in its template. This was an issue after bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#13. - Set count state via an input field to demonstrate mapped mutations. Two tests have been added to the spec for this new input field. Close bahmutov/cypress-vue-unit-testbahmutov/cypress-vue-unit-test#6 * minor: remove redundant declaration
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This request follows up #13 to finalize Vuex support. It works now @bahmutov 🙂
The solution required refactoring how Vue is initialized with in the app iframe. For increased thoroughness and confidence I've update the Counter example to utilize all the primary features of Vuex, and I've updated the test spec accordingly.