github
/
halo
mirror of https://github.com/halo-dev/halo
1
0
Fork 0
Code Issues Releases Wiki Activity

test: add Button component test snapshots 

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/3445/head
Ryan Wang 2022-04-12 14:36:19 +08:00
parent 1484d083b2
commit 52009c87c6
2 changed files with 30 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/base/button/__tests__/Button.spec.ts
View File

@ -5,6 +5,7 @@ import { mount } from "@vue/test-utils";
describe("Button", () => { describe("Button", () => {
it("should render", () => { it("should render", () => {
expect(mount(VButton).html()).contains("button"); expect(mount(VButton).html()).contains("button");
expect(mount(VButton).html()).toMatchSnapshot();
}); });
it("should render with text", () => { it("should render with text", () => {
@ -19,6 +20,8 @@ describe("Button", () => {
["primary", "secondary", "danger"].forEach((type) => { ["primary", "secondary", "danger"].forEach((type) => {
const button = mount(VButton, { props: { type } }); const button = mount(VButton, { props: { type } });
expect(button.html()).toMatchSnapshot();
expect(button.find(".btn").classes()).toContain(`btn-${type}`); expect(button.find(".btn").classes()).toContain(`btn-${type}`);
button.unmount(); button.unmount();
}); });
@ -30,6 +33,8 @@ describe("Button", () => {
["lg", "sm", "xs"].forEach((size) => { ["lg", "sm", "xs"].forEach((size) => {
const button = mount(VButton, { props: { size } }); const button = mount(VButton, { props: { size } });
expect(button.html()).toMatchSnapshot();
expect(button.find(".btn").classes()).toContain(`btn-${size}`); expect(button.find(".btn").classes()).toContain(`btn-${size}`);
button.unmount(); button.unmount();
}); });
@ -42,6 +47,7 @@ describe("Button", () => {
expect(button.find(".btn").classes()).not.toContain("btn-circle"); expect(button.find(".btn").classes()).not.toContain("btn-circle");
await button.setProps({ circle: true }); await button.setProps({ circle: true });
expect(button.html()).toMatchSnapshot();
expect(button.find(".btn").classes()).toContain("btn-circle"); expect(button.find(".btn").classes()).toContain("btn-circle");
}); });
@ -52,6 +58,7 @@ describe("Button", () => {
expect(button.find(".btn").classes()).not.toContain("btn-block"); expect(button.find(".btn").classes()).not.toContain("btn-block");
await button.setProps({ block: true }); await button.setProps({ block: true });
expect(button.html()).toMatchSnapshot();
expect(button.find(".btn").classes()).toContain("btn-block"); expect(button.find(".btn").classes()).toContain("btn-block");
}); });
@ -69,6 +76,8 @@ describe("Button", () => {
onClick.mockReset(); onClick.mockReset();
await button.setProps({ disabled: true }); await button.setProps({ disabled: true });
await button.trigger("click"); await button.trigger("click");
expect(button.html()).toMatchSnapshot();
expect(onClick).not.toHaveBeenCalled(); expect(onClick).not.toHaveBeenCalled();
}); });
}); });

21
src/components/base/button/__tests__/__snapshots__/Button.spec.ts.snap Normal file
View File

@ -0,0 +1,21 @@
// Vitest Snapshot v1
exports[`Button > should render 1`] = `"<button class=\\"btn btn-md btn-default\\"></button>"`;
exports[`Button > should work with block prop 1`] = `"<button class=\\"btn btn-md btn-default btn-block\\"></button>"`;
exports[`Button > should work with circle prop 1`] = `"<button class=\\"btn btn-md btn-default btn-circle\\"></button>"`;
exports[`Button > should work with disabled prop 1`] = `"<button class=\\"btn btn-md btn-default\\" disabled=\\"\\"></button>"`;
exports[`Button > should work with size prop 1`] = `"<button class=\\"btn btn-lg btn-default\\"></button>"`;
exports[`Button > should work with size prop 2`] = `"<button class=\\"btn btn-sm btn-default\\"></button>"`;
exports[`Button > should work with size prop 3`] = `"<button class=\\"btn btn-xs btn-default\\"></button>"`;
exports[`Button > should work with type prop 1`] = `"<button class=\\"btn btn-md btn-primary\\"></button>"`;
exports[`Button > should work with type prop 2`] = `"<button class=\\"btn btn-md btn-secondary\\"></button>"`;
exports[`Button > should work with type prop 3`] = `"<button class=\\"btn btn-md btn-danger\\"></button>"`;