bcgov / bcgov/entity

Vue3 upgrade: fix unit tests for DatePicker.vue

Open
#18,943 1 comment 0 reactions 0 assignees View on GitHub
ENTITY - DO NOT USE techdebt
Dominant language
JavaScript
Stars
23
Forks
62
Avg merge
24m
Merged PRs (30d)
1

Description

**Description:**
The DatePicker component has already been upgraded to Vue 3, but the unit tests for the component also need to get upgraded. Some work has already been done towards this on the feature branch, ~but there is an issue with including the DateMixin~ _The mixin problem appears to be resolved, however there are still a few other problems with the DatePicker unit tests_.

- [ ] Replace `VueWrapper` with `VueWrapper`. You can ignore the error "Cannot use namespace as a type" if it appears.
- [ ] Replace `wrapper.vm.$data.dateText` references with `wrapper.vm.date`. The data type will also have to be changed from string to Date.
- [ ] Replace `await Vue.nextTick()` with `await nextTick()`.
- [ ] Figure out why triggering a click to open a v-menu doesn't update the DOM (see code below). It will update the internal component values (ex. `displayPicker` will update to true), but it still won't be able to find the v-date-picker component. The v-menu component may need to be stubbed out based on [this thread](https://stackoverflow.com/questions/60126377/let-a-mocked-transition-finish-asap-inside-v-menu-in-a-vuetify-unit-test).

```
wrapper.find('#date-text-field').trigger('click')
await nextTick()
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Locate the DatePicker unit tests and inspect the VueWrapper, $data.dateText, Vue.nextTick, and v-menu click cases named in the issue. Run the tests before and after updating those references, and investigate the linked v-menu stubbing guidance. Done means the tests pass and the click opens the menu so the v-date-picker can be found.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, testing
Issue type
Refactor
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.