mirror of
https://github.com/iconify/iconify.git
synced 2024-11-09 23:00:56 +00:00
Use vitest in Vue tests, publish update for Vue component
This commit is contained in:
parent
ad18afe316
commit
a0169b225b
@ -22,7 +22,9 @@
|
||||
|
||||
<InlineDemo />
|
||||
|
||||
<LoadingDemo />
|
||||
<LoadingTest />
|
||||
<StyleTest />
|
||||
<InlineTest />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -45,7 +47,9 @@ import OfflineUsageDemo from './demo-components/UsageOffline.vue';
|
||||
import FullOfflineUsageDemo from './demo-components/UsageFullOffline.vue';
|
||||
import FullUsageDemo from './demo-components/UsageFull.vue';
|
||||
|
||||
import LoadingDemo from './test-components/LoadingDemo.vue';
|
||||
import LoadingTest from './test-components/LoadingDemo.vue';
|
||||
import StyleTest from './test-components/Style.vue';
|
||||
import InlineTest from './test-components/Inline.vue';
|
||||
|
||||
// Disable cache
|
||||
disableCache('all');
|
||||
@ -104,7 +108,9 @@ export default {
|
||||
OfflineUsageDemo,
|
||||
FullOfflineUsageDemo,
|
||||
FullUsageDemo,
|
||||
LoadingDemo,
|
||||
LoadingTest,
|
||||
StyleTest,
|
||||
InlineTest,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
@ -3,180 +3,150 @@
|
||||
<h1>Alignment (components/Alignment.vue)</h1>
|
||||
<div>
|
||||
<p>Icon with correct width/heigh ratio:</p>
|
||||
<Icon icon="experiment" />
|
||||
<Icon icon="demo" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Bad width/height ratio, default alignment (slice = false):</p>
|
||||
<Icon icon="experiment" width="2em" height="1em" />
|
||||
<Icon icon="experiment" width="1em" height="2em" />
|
||||
<Icon icon="demo" width="2em" height="1em" />
|
||||
<Icon icon="demo" width="1em" height="2em" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Slice:</p>
|
||||
<Icon icon="experiment" width="2em" height="1em" :slice="true" />
|
||||
<Icon icon="experiment" width="2em" height="1em" align="slice" />
|
||||
<Icon icon="demo" width="2em" height="1em" :slice="true" />
|
||||
<Icon icon="demo" width="2em" height="1em" align="slice" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Slice:</p>
|
||||
<Icon icon="experiment" width="1em" height="2em" :slice="true" />
|
||||
<Icon icon="experiment" width="1em" height="2em" align="slice" />
|
||||
<Icon icon="demo" width="1em" height="2em" :slice="true" />
|
||||
<Icon icon="demo" width="1em" height="2em" align="slice" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Left:</p>
|
||||
<Icon icon="experiment" width="2em" height="1em" hAlign="left" />
|
||||
<Icon icon="experiment" width="2em" height="1em" h-align="left" />
|
||||
<Icon icon="demo" width="2em" height="1em" hAlign="left" />
|
||||
<Icon icon="demo" width="2em" height="1em" h-align="left" />
|
||||
<Icon icon="demo" width="2em" height="1em" horizontalAlign="left" />
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="2em"
|
||||
height="1em"
|
||||
horizontalAlign="left"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
horizontal-align="left"
|
||||
/>
|
||||
<Icon icon="experiment" width="2em" height="1em" align="left" />
|
||||
<Icon icon="demo" width="2em" height="1em" align="left" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Left with slice:</p>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
hAlign="left"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
h-align="left"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
horizontalAlign="left"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
horizontal-align="left"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
align="left,slice"
|
||||
/>
|
||||
<Icon icon="demo" width="1em" height="2em" align="left,slice" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Right:</p>
|
||||
<Icon icon="experiment" width="2em" height="1em" hAlign="right" />
|
||||
<Icon icon="experiment" width="2em" height="1em" h-align="right" />
|
||||
<Icon icon="demo" width="2em" height="1em" hAlign="right" />
|
||||
<Icon icon="demo" width="2em" height="1em" h-align="right" />
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
horizontalAlign="right"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
horizontal-align="right"
|
||||
/>
|
||||
<Icon icon="experiment" width="2em" height="1em" align="right" />
|
||||
<Icon icon="demo" width="2em" height="1em" align="right" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Right with slice:</p>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
hAlign="right"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
h-align="right"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
horizontalAlign="right"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
horizontal-align="right"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
align="right,slice"
|
||||
/>
|
||||
<Icon icon="demo" width="1em" height="2em" align="right,slice" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Top:</p>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
verticalAlign="top"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
vertical-align="top"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
v-bind:v-align="'top'"
|
||||
/>
|
||||
<Icon icon="experiment" width="1em" height="2em" align="top" />
|
||||
<Icon icon="demo" width="1em" height="2em" verticalAlign="top" />
|
||||
<Icon icon="demo" width="1em" height="2em" vertical-align="top" />
|
||||
<Icon icon="demo" width="1em" height="2em" v-bind:v-align="'top'" />
|
||||
<Icon icon="demo" width="1em" height="2em" align="top" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Top with slice:</p>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
verticalAlign="top"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
vertical-align="top"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
v-bind:v-align="'top'"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
align="top"
|
||||
@ -185,55 +155,45 @@
|
||||
</div>
|
||||
<div>
|
||||
<p>Bottom:</p>
|
||||
<Icon icon="demo" width="1em" height="2em" verticalAlign="bottom" />
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="1em"
|
||||
height="2em"
|
||||
verticalAlign="bottom"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
vertical-align="bottom"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="1em"
|
||||
height="2em"
|
||||
v-bind:v-align="'bottom'"
|
||||
/>
|
||||
<Icon icon="experiment" width="1em" height="2em" align="bottom" />
|
||||
<Icon icon="demo" width="1em" height="2em" align="bottom" />
|
||||
</div>
|
||||
<div>
|
||||
<p>Bottom with slice:</p>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
verticalAlign="bottom"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
vertical-align="bottom"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
icon="demo"
|
||||
width="2em"
|
||||
height="1em"
|
||||
v-bind:v-align="'bottom'"
|
||||
:slice="true"
|
||||
/>
|
||||
<Icon
|
||||
icon="experiment"
|
||||
width="2em"
|
||||
height="1em"
|
||||
align="bottom,slice"
|
||||
/>
|
||||
<Icon icon="demo" width="2em" height="1em" align="bottom,slice" />
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
@ -3,17 +3,17 @@
|
||||
<h1>Class (components/Class.vue)</h1>
|
||||
<div>
|
||||
Default icon:
|
||||
<Icon icon="experiment" />
|
||||
<Icon icon="demo" />
|
||||
</div>
|
||||
<div>
|
||||
Red color:
|
||||
<Icon icon="experiment" class="red-color" />
|
||||
<Icon icon="experiment" :class="redClass" />
|
||||
<Icon icon="demo" class="red-color" />
|
||||
<Icon icon="demo" :class="redClass" />
|
||||
</div>
|
||||
<div>
|
||||
Red color and 20px:
|
||||
<Icon icon="experiment" class="red-color big-icon" />
|
||||
<Icon icon="experiment" :class="[redClass, bigIcon]" />
|
||||
<Icon icon="demo" class="red-color big-icon" />
|
||||
<Icon icon="demo" :class="[redClass, bigIcon]" />
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
@ -3,33 +3,42 @@
|
||||
<h1>Style (components/Style.vue)</h1>
|
||||
<div>
|
||||
Default icon:
|
||||
<Icon icon="experiment" />
|
||||
<Icon icon="demo" />
|
||||
</div>
|
||||
<div>
|
||||
Red color:
|
||||
<Icon icon="experiment" color="red" />
|
||||
<Icon icon="experiment" :style="{ color: 'red' }" />
|
||||
<Icon icon="experiment" style="color: red" />
|
||||
<Icon icon="experiment" :style="redIcon" />
|
||||
<Icon icon="demo" color="red" />
|
||||
<Icon
|
||||
icon="demo"
|
||||
:inline="true"
|
||||
:style="{ color: 'red', verticalAlign: 0 }"
|
||||
/>
|
||||
<Icon
|
||||
icon="demo"
|
||||
:inline="true"
|
||||
style="color: red; vertical-align: 0"
|
||||
/>
|
||||
<Icon icon="demo" :style="redIcon" />
|
||||
</div>
|
||||
<div>
|
||||
40px:
|
||||
<Icon icon="experiment" height="40" />
|
||||
<Icon icon="experiment" :width="40" />
|
||||
<Icon icon="experiment" :style="{ fontSize: '40px' }" />
|
||||
<Icon icon="experiment" style="font-size: 40px" />
|
||||
<Icon icon="experiment" :style="bigIcon" />
|
||||
<Icon icon="demo" height="40" />
|
||||
<Icon icon="demo" :width="40" />
|
||||
<Icon
|
||||
icon="demo"
|
||||
:inline="true"
|
||||
:style="{ fontSize: '40px', verticalAlign: 0 }"
|
||||
/>
|
||||
<Icon icon="demo" style="font-size: 40px" />
|
||||
<Icon icon="demo" :style="bigIcon" />
|
||||
</div>
|
||||
<div>
|
||||
Red and 40px:
|
||||
<Icon icon="experiment" height="40" color="red" />
|
||||
<Icon icon="experiment" :width="40" :style="redIcon" />
|
||||
<Icon
|
||||
icon="experiment"
|
||||
:style="{ color: 'red', fontSize: '40px' }"
|
||||
/>
|
||||
<Icon icon="experiment" style="color: red; font-size: 40px" />
|
||||
<Icon icon="experiment" :style="[bigIcon, redIcon]" />
|
||||
<Icon icon="demo" height="40" color="red" />
|
||||
<Icon icon="demo" :width="40" :style="redIcon" />
|
||||
<Icon icon="demo" :style="{ color: 'red', fontSize: '40px' }" />
|
||||
<Icon icon="demo" style="color: red; font-size: 40px" />
|
||||
<Icon icon="demo" :style="[bigIcon, redIcon]" />
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
@ -3,50 +3,46 @@
|
||||
<h1>Transformations (components/Transform.vue)</h1>
|
||||
<div>
|
||||
Default icon:
|
||||
<Icon icon="experiment" />
|
||||
<Icon icon="demo" />
|
||||
</div>
|
||||
<div>
|
||||
Flip horizontally:
|
||||
<Icon icon="experiment" :hFlip="true" />
|
||||
<Icon icon="experiment" flip="horizontal" />
|
||||
<Icon icon="experiment" :horizontal-flip="true" />
|
||||
<Icon icon="experiment" :h-flip="true" />
|
||||
<Icon icon="demo" :hFlip="true" />
|
||||
<Icon icon="demo" flip="horizontal" />
|
||||
<Icon icon="demo" :horizontal-flip="true" />
|
||||
<Icon icon="demo" :h-flip="true" />
|
||||
</div>
|
||||
<div>
|
||||
Flip vertically:
|
||||
<Icon icon="experiment" :vFlip="true" />
|
||||
<Icon icon="experiment" flip="vertical" />
|
||||
<Icon icon="experiment" :vertical-flip="true" />
|
||||
<Icon icon="experiment" :v-flip="true" />
|
||||
<Icon icon="demo" :vFlip="true" />
|
||||
<Icon icon="demo" flip="vertical" />
|
||||
<Icon icon="demo" :vertical-flip="true" />
|
||||
<Icon icon="demo" :v-flip="true" />
|
||||
</div>
|
||||
<div>
|
||||
Flip horizontally and vertically:
|
||||
<Icon icon="experiment" :hFlip="true" :vFlip="true" />
|
||||
<Icon icon="experiment" flip="horizontal,vertical" />
|
||||
<Icon
|
||||
icon="experiment"
|
||||
:horizontal-flip="true"
|
||||
:vertical-flip="true"
|
||||
/>
|
||||
<Icon icon="experiment" :h-flip="true" :v-flip="true" />
|
||||
<Icon icon="demo" :hFlip="true" :vFlip="true" />
|
||||
<Icon icon="demo" flip="horizontal,vertical" />
|
||||
<Icon icon="demo" :horizontal-flip="true" :vertical-flip="true" />
|
||||
<Icon icon="demo" :h-flip="true" :v-flip="true" />
|
||||
</div>
|
||||
<div>
|
||||
90° rotation:
|
||||
<Icon icon="experiment" :rotate="1" />
|
||||
<Icon icon="experiment" rotate="90deg" />
|
||||
<Icon icon="experiment" rotate="25%" />
|
||||
<Icon icon="demo" :rotate="1" />
|
||||
<Icon icon="demo" rotate="90deg" />
|
||||
<Icon icon="demo" rotate="25%" />
|
||||
</div>
|
||||
<div>
|
||||
180° rotation:
|
||||
<Icon icon="experiment" :rotate="2" />
|
||||
<Icon icon="experiment" rotate="180deg" />
|
||||
<Icon icon="experiment" rotate="50%" />
|
||||
<Icon icon="demo" :rotate="2" />
|
||||
<Icon icon="demo" rotate="180deg" />
|
||||
<Icon icon="demo" rotate="50%" />
|
||||
</div>
|
||||
<div>
|
||||
270° rotation:
|
||||
<Icon icon="experiment" :rotate="3" />
|
||||
<Icon icon="experiment" rotate="270deg" />
|
||||
<Icon icon="experiment" rotate="-25%" />
|
||||
<Icon icon="demo" :rotate="3" />
|
||||
<Icon icon="demo" rotate="270deg" />
|
||||
<Icon icon="demo" rotate="-25%" />
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
@ -1,10 +1,14 @@
|
||||
.DS_Store
|
||||
.babelrc
|
||||
.eslintignore
|
||||
.eslintrc.js
|
||||
node_modules
|
||||
src
|
||||
lib
|
||||
tests
|
||||
api-extractor.json
|
||||
api-extractor.*.json
|
||||
build.js
|
||||
tsconfig.json
|
||||
tsconfig.common.json
|
||||
*.config.js
|
||||
|
||||
vitest.config.ts
|
||||
|
@ -65,7 +65,7 @@ if (compile.api && !fileExists(packagesDir + '/vue/lib/IconifyIcon.d.ts')) {
|
||||
compile.lib = true;
|
||||
}
|
||||
|
||||
if (compile.lib && !fileExists(packagesDir + '/core/lib/cache.js')) {
|
||||
if (compile.lib && !fileExists(packagesDir + '/core/lib/cache.mjs')) {
|
||||
compile.core = true;
|
||||
}
|
||||
|
||||
|
9995
packages/vue/package-lock.json
generated
9995
packages/vue/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -2,7 +2,7 @@
|
||||
"name": "@iconify/vue",
|
||||
"description": "Iconify icon component for Vue 3.",
|
||||
"author": "Vjacheslav Trushkin",
|
||||
"version": "3.1.4",
|
||||
"version": "3.2.0",
|
||||
"license": "MIT",
|
||||
"bugs": "https://github.com/iconify/iconify/issues",
|
||||
"homepage": "https://iconify.design/",
|
||||
@ -18,7 +18,7 @@
|
||||
"build:dist": "rollup -c rollup.config.js",
|
||||
"prebuild:api": "api-extractor run --local --verbose --config api-extractor.offline.json",
|
||||
"build:api": "api-extractor run --local --verbose --config api-extractor.iconify.json",
|
||||
"test": "jest --runInBand"
|
||||
"test": "vitest"
|
||||
},
|
||||
"main": "dist/iconify.js",
|
||||
"module": "dist/iconify.mjs",
|
||||
@ -43,16 +43,16 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/preset-env": "^7.16.11",
|
||||
"@iconify/core": "^1.2.4",
|
||||
"@iconify/core": "^1.3.0",
|
||||
"@microsoft/api-extractor": "^7.19.4",
|
||||
"@rollup/plugin-node-resolve": "^13.1.3",
|
||||
"@types/jest": "^27.4.0",
|
||||
"@vue/test-utils": "^2.0.0-rc.18",
|
||||
"@vue/vue3-jest": "^27.0.0-alpha.4",
|
||||
"babel-jest": "^27.4.6",
|
||||
"jest": "^27.4.7",
|
||||
"@types/jest": "^27.4.1",
|
||||
"@vitejs/plugin-vue": "^2.2.4",
|
||||
"@vue/test-utils": "^2.0.0-rc.17",
|
||||
"jsdom": "^19.0.0",
|
||||
"rollup": "^2.66.0",
|
||||
"typescript": "^4.5.5",
|
||||
"vitest": "^0.7.6",
|
||||
"vue": "3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { loadIcons, iconExists } from '../../';
|
||||
import { mockAPIData } from '@iconify/core/lib/api/modules/mock';
|
||||
import { provider, nextPrefix } from './load';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon, loadIcons, iconExists } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon, iconExists } from '../../';
|
@ -12,4 +12,4 @@ _api.setAPIModule(provider, mockAPIModule);
|
||||
|
||||
// Prefix
|
||||
let counter = 0;
|
||||
export const nextPrefix = () => 'mock-' + counter++;
|
||||
export const nextPrefix = () => 'mock-' + (counter++).toString();
|
@ -1,3 +1,6 @@
|
||||
// Default data for empty icon
|
||||
export const defaultIconResult =
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"></svg>';
|
||||
|
||||
// Empty string: could be '<!---->' (jsdom) or '' (happy-dom), depending on testing envronment
|
||||
export const emptyString = '<!---->';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
||||
@ -26,7 +23,7 @@ describe('Creating component', () => {
|
||||
const wrapper = mount(Wrapper, {});
|
||||
await nextTick();
|
||||
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toEqual(
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe(
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M4 19h16v2H4zm5-4h11v2H9zm-5-4h16v2H4zm0-8h16v2H4zm5 4h11v2H9z" fill="currentColor"></path></svg>'
|
||||
);
|
||||
});
|
||||
@ -43,7 +40,7 @@ describe('Creating component', () => {
|
||||
});
|
||||
await nextTick();
|
||||
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toEqual(
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe(
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M4 19h16v2H4zm5-4h11v2H9zm-5-4h16v2H4zm0-8h16v2H4zm5 4h11v2H9z" fill="currentColor"></path></svg>'
|
||||
);
|
||||
});
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
||||
import { defaultIconResult } from '../empty';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { nextTick } from 'vue';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../';
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
// Import from file
|
||||
import { Icon } from '../../dist/offline';
|
@ -1,9 +1,7 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
// Import from alias
|
||||
import { Icon } from '../../offline';
|
||||
import { emptyString } from '../empty';
|
||||
|
||||
describe('Empty icon', () => {
|
||||
test('basic test', () => {
|
||||
@ -11,7 +9,7 @@ describe('Empty icon', () => {
|
||||
props: {},
|
||||
});
|
||||
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe('');
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe(emptyString);
|
||||
});
|
||||
|
||||
test('with child node', () => {
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../offline';
|
||||
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../offline';
|
||||
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../offline';
|
||||
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../dist/offline';
|
||||
|
@ -1,8 +1,6 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon, addIcon, addCollection } from '../../offline';
|
||||
import { emptyString } from '../empty';
|
||||
|
||||
const iconData = {
|
||||
body: '<path d="M4 19h16v2H4zm5-4h11v2H9zm-5-4h16v2H4zm0-8h16v2H4zm5 4h11v2H9z" fill="currentColor"/>',
|
||||
@ -93,6 +91,6 @@ describe('Using storage', () => {
|
||||
};
|
||||
|
||||
const wrapper = mount(Wrapper, {});
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe('');
|
||||
expect(wrapper.html().replace(/\s*\n\s*/g, '')).toBe(emptyString);
|
||||
});
|
||||
});
|
@ -1,6 +1,3 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { Icon } from '../../offline';
|
||||
|
7
packages/vue/tests/tsconfig.json
Normal file
7
packages/vue/tests/tsconfig.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"extends": "../tsconfig.common.json",
|
||||
"compilerOptions": {
|
||||
"types": ["node", "jest"],
|
||||
"rootDir": "."
|
||||
}
|
||||
}
|
13
packages/vue/tsconfig.common.json
Normal file
13
packages/vue/tsconfig.common.json
Normal file
@ -0,0 +1,13 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
"declaration": true,
|
||||
"sourceMap": false,
|
||||
"strict": false,
|
||||
"moduleResolution": "node",
|
||||
"esModuleInterop": true,
|
||||
"importsNotUsedAsValues": "error",
|
||||
"forceConsistentCasingInFileNames": true
|
||||
}
|
||||
}
|
@ -1,15 +1,9 @@
|
||||
{
|
||||
"extends": "./tsconfig.common.json",
|
||||
"compilerOptions": {
|
||||
"rootDir": "./src",
|
||||
"outDir": "./lib",
|
||||
"target": "ESNext",
|
||||
"module": "ESNext",
|
||||
"declaration": true,
|
||||
"sourceMap": false,
|
||||
"strict": false,
|
||||
"moduleResolution": "node",
|
||||
"esModuleInterop": true,
|
||||
"importsNotUsedAsValues": "error",
|
||||
"forceConsistentCasingInFileNames": true
|
||||
}
|
||||
"lib": ["ESNext", "DOM"]
|
||||
},
|
||||
"include": ["src/**/*.ts"]
|
||||
}
|
||||
|
14
packages/vue/vitest.config.ts
Normal file
14
packages/vue/vitest.config.ts
Normal file
@ -0,0 +1,14 @@
|
||||
/// <reference types="vitest" />
|
||||
|
||||
import { defineConfig } from 'vitest/config';
|
||||
import Vue from '@vitejs/plugin-vue';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [Vue()],
|
||||
test: {
|
||||
globals: true,
|
||||
watch: false,
|
||||
include: ['tests/**/*-test.ts'],
|
||||
environment: 'jsdom',
|
||||
},
|
||||
});
|
Loading…
Reference in New Issue
Block a user