Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WIP: Update tests for VTU beta-31 #10356

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/vuetify/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@
"@mdi/js": "^3.8.95",
"@types/jest": "^24.0.15",
"@types/node": "^12.6.8",
"@vue/test-utils": "^1.0.0-beta.29",
"@vue/test-utils": "^1.0.0-beta.31",
"autoprefixer": "^9.6.1",
"babel-loader": "^8.0.6",
"babel-plugin-detective": "^2.0.0",
Expand Down
68 changes: 37 additions & 31 deletions packages/vuetify/src/components/VAlert/__tests__/VAlert.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,6 @@ describe('VAlert.ts', () => {
mountFunction = (options = {}) => {
return mount(VAlert, {
...options,
// https://github.com/vuejs/vue-test-utils/issues/1130
sync: false,
mocks: {
$vuetify: {
lang: {
Expand All @@ -36,9 +34,14 @@ describe('VAlert.ts', () => {

expect(wrapper.element.style.display).toBe('')
expect(wrapper.html()).toMatchSnapshot()
})

wrapper.setProps({ value: false })
await wrapper.vm.$nextTick()
it('should sets display to none when value is false', async () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
it('should sets display to none when value is false', async () => {
it('should be hidden when value is false', async () => {

const wrapper = mountFunction({
propsData: {
value: false,
}
})

expect(wrapper.element.style.display).toBe('none')
expect(wrapper.html()).toMatchSnapshot()
Expand All @@ -60,7 +63,7 @@ describe('VAlert.ts', () => {
})

const icon = wrapper.find('.v-alert__dismissible')
const input = jest.fn(show => wrapper.setProps({ show }))
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks like this wasn't doing anything, removing it made no difference

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think that was supposed to be like v-model from before it stored its own state.

const input = jest.fn()

wrapper.vm.$on('input', input)

Expand Down Expand Up @@ -89,26 +92,22 @@ describe('VAlert.ts', () => {
expect(wrapper.contains('.v-icon')).toBe(false)
})

// TODO: this fails without sync, nextTick doesn't help
// https://github.com/vuejs/vue-test-utils/issues/1130
it.skip('should display contextual colors by type', async () => {
it('should display contextual colors by type', () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be merged with the one below

const wrapper = mountFunction({
propsData: { type: 'error' },
})

expect(wrapper.classes('error')).toBe(true)
})

wrapper.setProps({ type: 'success' })
await wrapper.vm.$nextTick()
expect(wrapper.classes('success')).toBe(true)

wrapper.setProps({ type: 'warning' })
await wrapper.vm.$nextTick()
expect(wrapper.classes('warning')).toBe(true)
;['success', 'error', 'warning', 'info'].forEach(type => {
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can avoid using setProps and just test all four colors using a simple for loop - no await nextTick is needed here, seems legit

it('should display contextual colors by type', () => {
const wrapper = mountFunction({
propsData: { type },
})

wrapper.setProps({ type: 'info' })
await wrapper.vm.$nextTick()
expect(wrapper.classes('info')).toBe(true)
expect(wrapper.classes(type)).toBe(true)
})
})

it('should allow overriding color for contextual alert', () => {
Expand All @@ -135,22 +134,20 @@ describe('VAlert.ts', () => {
expect(icon.text()).toBe('block')
})

it('should show border', async () => {
const directions = ['top', 'right', 'bottom', 'left']
const wrapper = mountFunction()

expect(wrapper.classes('v-alert--border')).toBe(false)

for (const border of directions) {
wrapper.setProps({ border })
await wrapper.vm.$nextTick()
;['top', 'right', 'bottom', 'left'].forEach(border => {
it('should show border', async () => {
const wrapper = mountFunction({
propsData: {
border,
}
})

expect(wrapper.classes('v-alert--border')).toBe(true)
expect(wrapper.classes(`v-alert--border-${border}`)).toBe(true)
}
})
})

it('should move color classes to border and icon elements', async () => {
it('renders without a colored border and icons', async () => {
const wrapper = mountFunction({
propsData: {
color: 'pink',
Expand All @@ -161,9 +158,18 @@ describe('VAlert.ts', () => {

expect(wrapper.classes('pink')).toBe(true)
expect(border.classes('pink')).toBe(false)
})

it('renders a colored border and icons', async () => {
const wrapper = mountFunction({
propsData: {
color: 'pink',
border: 'left',
coloredBorder: true,
},
})
const border = wrapper.find('.v-alert__border')

wrapper.setProps({ coloredBorder: true })
await wrapper.vm.$nextTick()
expect(wrapper.classes('pink')).toBe(false)
expect(border.classes('pink')).toBe(true)
expect(border.classes('v-alert__border--has-color')).toBe(true)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -69,3 +69,15 @@ exports[`VAlert.ts should have a close icon 1`] = `
</div>
</div>
`;

exports[`VAlert.ts should sets display to none when value is false 1`] = `
<div role="alert"
class="v-alert v-sheet theme--light"
style="display: none;"
>
<div class="v-alert__wrapper">
<div class="v-alert__content">
</div>
</div>
</div>
`;
66 changes: 58 additions & 8 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -2551,13 +2551,14 @@
resolved "https://registry.yarnpkg.com/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.0.tgz#d768dba004261c029b53a77c5ea2d5f9ee4f3cce"
integrity sha512-rcn2KhSHESBFMPj5vc5X2pI9bcBNQQixvJXhD5gZ4rN2iym/uH2qfDSQfUS5+qwiz0a85TCkeUs6w6jxFDudbw==

"@vue/test-utils@^1.0.0-beta.29":
version "1.0.0-beta.29"
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.29.tgz#c942cf25e891cf081b6a03332b4ae1ef430726f0"
integrity sha512-yX4sxEIHh4M9yAbLA/ikpEnGKMNBCnoX98xE1RwxfhQVcn0MaXNSj1Qmac+ZydTj6VBSEVukchBogXBTwc+9iA==
"@vue/test-utils@^1.0.0-beta.31":
version "1.0.0-beta.31"
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.31.tgz#580d6e45f07452e497d69807d80986e713949b73"
integrity sha512-IlhSx5hyEVnbvDZ3P98R1jNmy88QAd/y66Upn4EcvxSD5D4hwOutl3dIdfmSTSXs4b9DIMDnEVjX7t00cvOnvg==
dependencies:
dom-event-types "^1.0.0"
lodash "^4.17.4"
lodash "^4.17.15"
pretty "^2.0.0"

"@vue/web-component-wrapper@^1.2.0":
version "1.2.0"
Expand Down Expand Up @@ -4584,7 +4585,16 @@ concurrently@^4.1.1:
tree-kill "^1.1.0"
yargs "^12.0.1"

config-chain@^1.1.11:
condense-newlines@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/condense-newlines/-/condense-newlines-0.2.1.tgz#3de985553139475d32502c83b02f60684d24c55f"
integrity sha1-PemFVTE5R10yUCyDsC9gaE0kxV8=
dependencies:
extend-shallow "^2.0.1"
is-whitespace "^0.3.0"
kind-of "^3.0.2"

config-chain@^1.1.11, config-chain@^1.1.12:
version "1.1.12"
resolved "https://registry.yarnpkg.com/config-chain/-/config-chain-1.1.12.tgz#0fde8d091200eb5e808caf25fe618c02f48e4efa"
integrity sha512-a1eOIcu8+7lUInge4Rpf/n4Krkf3Dd9lqhljRzII1/Zno/kRtUWnznPO3jOKBmTEktkt3fkxisUcivoj0ebzoA==
Expand Down Expand Up @@ -5740,6 +5750,16 @@ ecc-jsbn@~0.1.1:
jsbn "~0.1.0"
safer-buffer "^2.1.0"

editorconfig@^0.15.3:
version "0.15.3"
resolved "https://registry.yarnpkg.com/editorconfig/-/editorconfig-0.15.3.tgz#bef84c4e75fb8dcb0ce5cee8efd51c15999befc5"
integrity sha512-M9wIMFx96vq0R4F+gRpY3o2exzb8hEj/n9S8unZtHSvYjibBp/iMufSzvmOcV/laG0ZtuTVGtiJggPOSW2r93g==
dependencies:
commander "^2.19.0"
lru-cache "^4.1.5"
semver "^5.6.0"
sigmund "^1.0.1"

ee-first@1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
Expand Down Expand Up @@ -8265,6 +8285,11 @@ is-utf8@^0.2.0:
resolved "https://registry.yarnpkg.com/is-utf8/-/is-utf8-0.2.1.tgz#4b0da1442104d1b336340e80797e865cf39f7d72"
integrity sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=

is-whitespace@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/is-whitespace/-/is-whitespace-0.3.0.tgz#1639ecb1be036aec69a54cbb401cfbed7114ab7f"
integrity sha1-Fjnssb4DauxppUy7QBz77XEUq38=

is-windows@^1.0.0, is-windows@^1.0.1, is-windows@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-1.0.2.tgz#d1850eb9791ecd18e6182ce12a30f396634bb19d"
Expand Down Expand Up @@ -8771,6 +8796,17 @@ joi@^13.0.0:
isemail "3.x.x"
topo "3.x.x"

js-beautify@^1.6.12:
version "1.10.3"
resolved "https://registry.yarnpkg.com/js-beautify/-/js-beautify-1.10.3.tgz#c73fa10cf69d3dfa52d8ed624f23c64c0a6a94c1"
integrity sha512-wfk/IAWobz1TfApSdivH5PJ0miIHgDoYb1ugSqHcODPmaYu46rYe5FVuIEkhjg8IQiv6rDNPyhsqbsohI/C2vQ==
dependencies:
config-chain "^1.1.12"
editorconfig "^0.15.3"
glob "^7.1.3"
mkdirp "~0.5.1"
nopt "~4.0.1"

js-levenshtein@^1.1.3:
version "1.1.6"
resolved "https://registry.yarnpkg.com/js-levenshtein/-/js-levenshtein-1.1.6.tgz#c6cee58eb3550372df8deb85fad5ce66ce01d59d"
Expand Down Expand Up @@ -9458,7 +9494,7 @@ lru-cache@4.0.1:
pseudomap "^1.0.1"
yallist "^2.0.0"

lru-cache@^4.0.1, lru-cache@^4.1.1, lru-cache@^4.1.2:
lru-cache@^4.0.1, lru-cache@^4.1.1, lru-cache@^4.1.2, lru-cache@^4.1.5:
version "4.1.5"
resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
integrity sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==
Expand Down Expand Up @@ -10219,7 +10255,7 @@ nopt@1.0.10:
dependencies:
abbrev "1"

nopt@^4.0.1:
nopt@^4.0.1, nopt@~4.0.1:
version "4.0.1"
resolved "https://registry.yarnpkg.com/nopt/-/nopt-4.0.1.tgz#d0d4685afd5415193c8c7505602d0d17cd64474d"
integrity sha1-0NRoWv1UFRk8jHUFYC0NF81kR00=
Expand Down Expand Up @@ -11528,6 +11564,15 @@ pretty-format@^24.8.0:
ansi-styles "^3.2.0"
react-is "^16.8.4"

pretty@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/pretty/-/pretty-2.0.0.tgz#adbc7960b7bbfe289a557dc5f737619a220d06a5"
integrity sha1-rbx5YLe7/iiaVX3F9zdhmiINBqU=
dependencies:
condense-newlines "^0.2.1"
extend-shallow "^2.0.1"
js-beautify "^1.6.12"

prismjs@^1.17.1:
version "1.17.1"
resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.17.1.tgz#e669fcbd4cdd873c35102881c33b14d0d68519be"
Expand Down Expand Up @@ -12935,6 +12980,11 @@ shellwords@^0.1.1:
resolved "https://registry.yarnpkg.com/shellwords/-/shellwords-0.1.1.tgz#d6b9181c1a48d397324c84871efbcfc73fc0654b"
integrity sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==

sigmund@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/sigmund/-/sigmund-1.0.1.tgz#3ff21f198cad2175f9f3b781853fd94d0d19b590"
integrity sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=

signal-exit@^3.0.0, signal-exit@^3.0.2:
version "3.0.2"
resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.2.tgz#b5fdc08f1287ea1178628e415e25132b73646c6d"
Expand Down