From 32a4cb804bdd5d24056072a647aade7dfa668821 Mon Sep 17 00:00:00 2001 From: Evan You Date: Wed, 15 Jul 2020 10:38:45 -0400 Subject: [PATCH] test: improve coverage --- .../__tests__/rendererChildren.spec.ts | 13 ++++- .../__tests__/rendererFragment.spec.ts | 14 +++++ packages/runtime-core/src/component.ts | 1 + packages/runtime-core/src/warning.ts | 4 ++ .../__tests__/helpers/useCssModule.spec.ts | 55 +++++++++++++++++++ .../runtime-dom/src/helpers/useCssModule.ts | 5 +- .../runtime-dom/src/helpers/useCssVars.ts | 1 + 7 files changed, 89 insertions(+), 4 deletions(-) create mode 100644 packages/runtime-dom/__tests__/helpers/useCssModule.spec.ts diff --git a/packages/runtime-core/__tests__/rendererChildren.spec.ts b/packages/runtime-core/__tests__/rendererChildren.spec.ts index 93ef3b99..22c2d101 100644 --- a/packages/runtime-core/__tests__/rendererChildren.spec.ts +++ b/packages/runtime-core/__tests__/rendererChildren.spec.ts @@ -40,7 +40,7 @@ function shuffle(array: Array) { return array } -it('should patch previously empty children', () => { +test('should patch previously empty children', () => { const root = nodeOps.createElement('div') render(h('div', []), root) @@ -50,7 +50,7 @@ it('should patch previously empty children', () => { expect(inner(root)).toBe('
hello
') }) -it('should patch previously null children', () => { +test('should patch previously null children', () => { const root = nodeOps.createElement('div') render(h('div'), root) @@ -60,6 +60,15 @@ it('should patch previously null children', () => { expect(inner(root)).toBe('
hello
') }) +test('array children -> text children', () => { + const root = nodeOps.createElement('div') + render(h('div', [h('div')]), root) + expect(inner(root)).toBe('
') + + render(h('div', 'hello'), root) + expect(inner(root)).toBe('
hello
') +}) + describe('renderer: keyed children', () => { let root: TestElement let elm: TestElement diff --git a/packages/runtime-core/__tests__/rendererFragment.spec.ts b/packages/runtime-core/__tests__/rendererFragment.spec.ts index a44c89d3..9e1f87ae 100644 --- a/packages/runtime-core/__tests__/rendererFragment.spec.ts +++ b/packages/runtime-core/__tests__/rendererFragment.spec.ts @@ -129,6 +129,20 @@ describe('renderer: fragment', () => { root ) expect(serializeInner(root)).toBe(`
foo
barbaz`) + + render( + createVNode( + Fragment, + null, + [ + createTextVNode('baz'), + createVNode('div', null, 'foo', PatchFlags.TEXT) + ], + PatchFlags.UNKEYED_FRAGMENT + ), + root + ) + expect(serializeInner(root)).toBe(`baz
foo
`) }) it('patch fragment children (compiler generated, keyed)', () => { diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts index 404bb15b..a3a11276 100644 --- a/packages/runtime-core/src/component.ts +++ b/packages/runtime-core/src/component.ts @@ -690,6 +690,7 @@ const classifyRE = /(?:^|[-_])(\w)/g const classify = (str: string): string => str.replace(classifyRE, c => c.toUpperCase()).replace(/[-_]/g, '') +/* istanbul ignore next */ export function formatComponentName( instance: ComponentInternalInstance | null, Component: Component, diff --git a/packages/runtime-core/src/warning.ts b/packages/runtime-core/src/warning.ts index 07f8a27b..f297d926 100644 --- a/packages/runtime-core/src/warning.ts +++ b/packages/runtime-core/src/warning.ts @@ -57,6 +57,7 @@ export function warn(msg: string, ...args: any[]) { ) } else { const warnArgs = [`[Vue warn]: ${msg}`, ...args] + /* istanbul ignore if */ if ( trace.length && // avoid spamming console during tests @@ -99,6 +100,7 @@ function getComponentTrace(): ComponentTraceStack { return normalizedStack } +/* istanbul ignore next */ function formatTrace(trace: ComponentTraceStack): any[] { const logs: any[] = [] trace.forEach((entry, i) => { @@ -122,6 +124,7 @@ function formatTraceEntry({ vnode, recurseCount }: TraceEntry): any[] { : [open + close] } +/* istanbul ignore next */ function formatProps(props: Data): any[] { const res: any[] = [] const keys = Object.keys(props) @@ -136,6 +139,7 @@ function formatProps(props: Data): any[] { function formatProp(key: string, value: unknown): any[] function formatProp(key: string, value: unknown, raw: true): any +/* istanbul ignore next */ function formatProp(key: string, value: unknown, raw?: boolean): any { if (isString(value)) { value = JSON.stringify(value) diff --git a/packages/runtime-dom/__tests__/helpers/useCssModule.spec.ts b/packages/runtime-dom/__tests__/helpers/useCssModule.spec.ts new file mode 100644 index 00000000..b92c9c16 --- /dev/null +++ b/packages/runtime-dom/__tests__/helpers/useCssModule.spec.ts @@ -0,0 +1,55 @@ +import { render, h, nodeOps } from '@vue/runtime-test' +import { useCssModule } from '../../src/helpers/useCssModule' +import { mockWarn } from '@vue/shared' + +describe('useCssModule', () => { + mockWarn() + + function mountWithModule(modules: any, name?: string) { + let res + render( + h({ + render() {}, + __cssModules: modules, + setup() { + res = useCssModule(name) + } + }), + nodeOps.createElement('div') + ) + return res + } + + test('basic usage', () => { + const modules = { + $style: { + red: 'red' + } + } + expect(mountWithModule(modules)).toMatchObject(modules.$style) + }) + + test('basic usage', () => { + const modules = { + foo: { + red: 'red' + } + } + expect(mountWithModule(modules, 'foo')).toMatchObject(modules.foo) + }) + + test('warn out of setup usage', () => { + useCssModule() + expect('must be called inside setup').toHaveBeenWarned() + }) + + test('warn missing injection', () => { + mountWithModule(undefined) + expect('instance does not have CSS modules').toHaveBeenWarned() + }) + + test('warn missing injection', () => { + mountWithModule({ $style: { red: 'red' } }, 'foo') + expect('instance does not have CSS module named "foo"').toHaveBeenWarned() + }) +}) diff --git a/packages/runtime-dom/src/helpers/useCssModule.ts b/packages/runtime-dom/src/helpers/useCssModule.ts index 18b7048f..d96dc69c 100644 --- a/packages/runtime-dom/src/helpers/useCssModule.ts +++ b/packages/runtime-dom/src/helpers/useCssModule.ts @@ -2,10 +2,11 @@ import { warn, getCurrentInstance } from '@vue/runtime-core' import { EMPTY_OBJ } from '@vue/shared' export function useCssModule(name = '$style'): Record { + /* istanbul ignore else */ if (!__GLOBAL__) { const instance = getCurrentInstance()! if (!instance) { - __DEV__ && warn(`useCSSModule must be called inside setup()`) + __DEV__ && warn(`useCssModule must be called inside setup()`) return EMPTY_OBJ } const modules = instance.type.__cssModules @@ -22,7 +23,7 @@ export function useCssModule(name = '$style'): Record { return mod as Record } else { if (__DEV__) { - warn(`useCSSModule() is not supported in the global build.`) + warn(`useCssModule() is not supported in the global build.`) } return EMPTY_OBJ } diff --git a/packages/runtime-dom/src/helpers/useCssVars.ts b/packages/runtime-dom/src/helpers/useCssVars.ts index 5bf4f469..fde93880 100644 --- a/packages/runtime-dom/src/helpers/useCssVars.ts +++ b/packages/runtime-dom/src/helpers/useCssVars.ts @@ -14,6 +14,7 @@ export function useCssVars( scoped = false ) { const instance = getCurrentInstance() + /* istanbul ignore next */ if (!instance) { __DEV__ && warn(`useCssVars is called without current active component instance.`)