Skip to content

Commit 95593c0

Browse files
KacirasKaciras
committed
refactor tests
1 parent c8c4b84 commit 95593c0

File tree

5 files changed

+57
-65
lines changed

5 files changed

+57
-65
lines changed

‎test/__snapshots__/convert-test.ts.snap

+1-7
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,6 @@ exports[`should change <svg>'s attributes with custom function 1`] = `"<template
66
77
exports[`should change <svg>'s attributes with svgProps 1`] = `"<template><svg :data-foo="1" width="1em" height="1em" fill="currentColor" viewBox="0 0 5 5"><path id="rect" d="M0 0h10v10H0z"/></svg></template><style scoped>#rect{fill:#00f}</style>"`;
88
9-
exports[`should change attributes 1`] = `"<template><svg width="1em" height="1em" fill="currentColor" viewBox="0 0 20 20"><path id="rect" d="M0 0h10v10H0z"/></svg></template><style scoped>#rect{fill:#00f}</style>"`;
10-
119
exports[`should change the stroke attribute 1`] = `"<template><svg id="layer_1" width="1em" height="1em" fill="none" stroke="currentColor" stroke-width="2" data-name="layer 1" viewBox="0 0 92.01 92.55"><path d="m90.02 66.22-31.11-.97-18.43 25.08-8.69-29.89-29.55-9.78 25.74-17.5.17-31.13 24.6 19.07 29.65-9.45-10.54 29.28z"/></svg></template>"`;
1210
13-
exports[`should extract styles 1`] = `"<template><svg width="1em" height="1em" fill="currentColor" viewBox="0 0 20 20"><path id="rect" d="M0 0h10v10H0z"/></svg></template><style scoped>#rect{fill:#00f}</style>"`;
14-
15-
exports[`should remove processing instructions in dev 1`] = `"<template><svg fill="currentColor" height="1em" width="1em"><path d="M0 0h24v24H0zm0 0h24v24H0zm0 0h24v24H0zm0 0h24v24H0z"/></svg></template>"`;
16-
17-
exports[`should remove processing instructions in prod 1`] = `"<template><svg width="1em" height="1em" fill="currentColor"><path d="M0 0h24v24H0zm0 0h24v24H0zm0 0h24v24H0zm0 0h24v24H0z"/></svg></template>"`;
11+
exports[`should minify attributes 1`] = `"<template><svg width="1em" height="1em" fill="currentColor" viewBox="0 0 20 20"><path id="rect" d="M0 0h10v10H0z"/></svg></template><style scoped>#rect{fill:#00f}</style>"`;

‎test/convert-test.ts

+41-40
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,39 @@
1-
import { expect, it } from "vitest";
2-
import { convert, resolveFixture, TestOptions } from "./test-helper.ts";
3-
import { SVGSFCConvertor } from "../index.ts";
4-
import { basename } from "path";
51
import { readFileSync } from "fs";
2+
import { basename } from "path";
3+
import { expect, it } from "vitest";
4+
import { resolveFixture } from "./test-helper.ts";
5+
import { SVGSFCConvertor, SVGSFCOptions } from "../index.ts";
66

77
const strokeSVG = readFileSync(resolveFixture("stroke.svg"), "utf8");
88

9-
it("should change attributes", async () => {
10-
expect(await convert("styles-0.svg?sfc")).toMatchSnapshot();
9+
function convert(name: string, options?: SVGSFCOptions) {
10+
const svg = readFileSync(resolveFixture(name), "utf8");
11+
return new SVGSFCConvertor(options).convert(svg, name);
12+
}
13+
14+
it("should remove processing instructions", () => {
15+
expect(convert("instruction.svg")).toMatch(/^<template><svg /);
1116
});
1217

13-
it("should change the stroke attribute", async () => {
14-
expect(await convert("stroke.svg?sfc")).toMatchSnapshot();
18+
it("should remove processing instructions when minify", () => {
19+
expect(convert("instruction.svg", { minify: true })).toMatch(/^<template><svg /);
1520
});
1621

17-
it("should remove processing instructions in dev", async () => {
18-
expect(await convert("instruction.svg?sfc", { mode: "development" })).toMatchSnapshot();
22+
it("should minify attributes", () => {
23+
expect(convert("styles-0.svg", { minify: true })).toMatchSnapshot();
1924
});
2025

21-
it("should remove processing instructions in prod", async () => {
22-
expect(await convert("instruction.svg?sfc")).toMatchSnapshot();
26+
it("should change the stroke attribute", () => {
27+
expect(convert("stroke.svg", { minify: true })).toMatchSnapshot();
2328
});
2429

25-
it("should extract styles", async () => {
26-
const code = await convert("styles-0.svg?sfc");
27-
expect(code.toString()).toMatchSnapshot();
30+
it("should extract styles", () => {
31+
expect(convert("styles-0.svg"))
32+
.toContain("<style scoped>#rect { fill: blue; }.st0 { width: 100px; }</style>");
2833
});
2934

30-
it("should not process SVG if svgo option is false", async () => {
31-
const config = { svgo: false } as const;
32-
const code = await convert("stroke.svg?sfc", { config });
35+
it("should not process SVG if svgo option is false", () => {
36+
const code = convert("stroke.svg", { svgo: false });
3337
expect(code).toBe(`<template>${strokeSVG}</template>`);
3438
});
3539

@@ -54,34 +58,31 @@ it("should support configure SVG plugins", () => {
5458
});
5559

5660
it("should apply only extractCSS plugin", () => {
57-
const promise = convert("styles-0.svg?sfc", {
58-
config: {
59-
svgo: { plugins: ["extractCSS"] },
60-
},
61-
});
62-
return expect(promise).resolves.toMatchSnapshot();
61+
const config: SVGSFCOptions = {
62+
minify: true,
63+
svgo: { plugins: ["extractCSS"] },
64+
};
65+
return expect(convert("styles-0.svg", config)).toMatchSnapshot();
6366
});
6467

65-
it("should change <svg>'s attributes with svgProps", async () => {
66-
const config: TestOptions = {
67-
config: {
68-
svgProps: {
69-
":data-foo": "1", // Add new
70-
viewBox: "0 0 5 5", // Replace
71-
},
68+
it("should change <svg>'s attributes with svgProps", () => {
69+
const config: SVGSFCOptions = {
70+
minify: true,
71+
svgProps: {
72+
":data-foo": "1", // Add new
73+
viewBox: "0 0 5 5", // Replace
7274
},
7375
};
74-
expect(await convert("styles-0.svg?sfc", config)).toMatchSnapshot();
76+
expect(convert("styles-0.svg", config)).toMatchSnapshot();
7577
});
7678

77-
it("should change <svg>'s attributes with custom function", async () => {
78-
const config: TestOptions = {
79-
config: {
80-
svgProps(attrs, path, passes) {
81-
attrs.path = basename(path);
82-
attrs.passes = passes;
83-
},
79+
it("should change <svg>'s attributes with custom function", () => {
80+
const config: SVGSFCOptions = {
81+
minify: true,
82+
svgProps(attrs, path, passes) {
83+
attrs.passes = passes;
84+
attrs.path = basename(path);
8485
},
8586
};
86-
expect(await convert("styles-0.svg?sfc", config)).toMatchSnapshot();
87+
expect(convert("styles-0.svg", config)).toMatchSnapshot();
8788
});

‎test/plugin-test.ts

+10-14
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import { renderToString } from "vue/server-renderer";
1010
import { compile, convert, copyFixture, createHMRClient, resolveFixture, useTempDirectory } from "./test-helper.ts";
1111
import svgSfc from "../index.ts";
1212

13-
const input = "image.svg";
1413
const tmpDir = useTempDirectory(cwd());
1514

1615
async function loadBundle<T = any>(code: string) {
@@ -19,25 +18,22 @@ async function loadBundle<T = any>(code: string) {
1918
return (await import("file://" + file)).default as T;
2019
}
2120

22-
it("should throw on non-SVG data", async () => {
23-
const build = convert("png-data.svg?sfc");
24-
await expect(build).rejects.toThrow();
21+
it("should throw on non-SVG data", () => {
22+
return expect(convert("png-data.svg?sfc")).rejects.toThrow(/Could not load/);
2523
});
2624

27-
it("should throw on non-exists file", async () => {
28-
const build = convert("not exists.svg?sfc");
29-
await expect(build).rejects.toThrow();
25+
it("should throw on non-exists file", () => {
26+
return expect(convert("not exists.svg?sfc")).rejects.toThrow(/Cannot resolve file/);
3027
});
3128

3229
it("should keep query in the URL", async () => {
3330
const bundle = await compile("stroke.svg?foo=1&sfc&bar");
34-
const absPath = resolveFixture("stroke.svg").replaceAll("\\", "/");
35-
expect(bundle.output[0].facadeModuleId)
36-
.toBe(resolve(absPath) + ".vue?foo=1&sfc&bar");
31+
const absPath = resolveFixture("stroke.svg");
32+
expect(bundle.output[0].facadeModuleId).toBe(resolve(absPath) + ".vue?foo=1&sfc&bar");
3733
});
3834

39-
it("should not minify on dev mode", async () => {
40-
expect(await convert("stroke.svg?sfc", { mode: "development" })).toMatchSnapshot();
35+
it("should not minify on dev mode", () => {
36+
return expect(convert("stroke.svg?sfc", { mode: "development" })).resolves.toMatchSnapshot();
4137
});
4238

4339
it("should support set minify in options", async () => {
@@ -73,7 +69,7 @@ it("should work with @vitejs/plugin-vue", async () => {
7369

7470
it("should support HMR", async () => {
7571
const filename = join(tmpDir, "image.svg");
76-
const mainUrl = `/${input}?sfc`;
72+
const mainUrl = "/image.svg?sfc";
7773
const styleUrl = `/${filename}.vue?vue&type=style&index=0&scoped=true&lang.css`;
7874

7975
copyFixture("styles-0.svg", filename);
@@ -83,7 +79,7 @@ it("should support HMR", async () => {
8379
root: tmpDir,
8480
build: {
8581
rollupOptions: {
86-
input: input + "?sfc",
82+
input: "image.svg?sfc",
8783
},
8884
},
8985
plugins: [svgSfc(), vue()],

‎test/rollup-test.ts

+1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import svgSfc from "../index.ts";
55

66
it("should work with rollup", async () => {
77
const build = await rollup({
8+
logLevel: "silent",
89
input: resolveFixture("instruction.svg?sfc"),
910
plugins: [svgSfc(), extractSFCPlugin],
1011
});

‎test/test-helper.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -27,18 +27,18 @@ export interface TestOptions {
2727
config?: SVGSFCPluginOptions;
2828
}
2929

30-
export async function compile(fixture: string, options: TestOptions = {}) {
30+
export function compile(fixture: string, options: TestOptions = {}) {
3131
const { mode, config } = options;
3232

33-
return <RollupOutput>await build({
33+
return <Promise<RollupOutput>>build({
3434
logLevel: "silent",
3535
mode,
3636
build: {
3737
write: false,
3838
rollupOptions: {
3939
input: resolveFixture(fixture),
4040

41-
// Remove hash from file name.
41+
// Remove hash from file names.
4242
output: {
4343
entryFileNames: "[name].js",
4444
chunkFileNames: "[name].js",
@@ -83,7 +83,7 @@ export function useTempDirectory(parent = tmpdir()) {
8383
}
8484

8585
export function resolveFixture(name: string) {
86-
return join("test/fixtures", name);
86+
return `test/fixtures/${name}`;
8787
}
8888

8989
export function copyFixture(name: string, dist: string) {

0 commit comments

Comments
 (0)