ditdot-dev/vue-flow-form

Bug: MultipleChoiceType answers not being marked as selected when navigating through pages

coxlr opened this issue · 1 comments

coxlr commented

Describe the bug
When using the question component method as described here #136 (comment) the answers for MultipleChoiceType are not populated when using the navigation link to click through the questions to check answers.

To Reproduce
I have created an example repo here coxlr/vue-flow-form and updated the Example.vue file in the examples/questionnaire' directory. Example.vue

To reproduce

# clone the repo and install dependancies
git clone https://github.com/coxlr/vue-flow-form.git vue-flow-form
cd vue-flow-form
npm install
npm run dev

Answer the first few MultipleChoiceType questions, then use the back button in the progress bar to navigate back through the questions. You can see that the MultipleChoiceType questions do not get re marked as selected.

Expected behavior
The selected answer options should be selected when navigating back and forwards between pages.

Desktop (please complete the following information):

  • Device: MacBook
  • OS: IOS
  • Browser chrome, safari & firefox

Additional context
Digging in to it a little, it looks like the toggleAnswer function that currently gets called in the mounted hook needs to be called. I tried replicating the code in the active method in the watch function in the MultipleChoiceType.vue component and this worked to mark the answer options a selected, when click back to a page, but not when going forward to a page. I also did not repopulate the 'Other' option if selected.

spinn commented

Thank you for the bug report and even more for the test case, if only all bug reports were written like this :)

The issue has been fixed in 3d715b9.