tech: use enzyme to json instead of react test renderer
This commit is contained in:
Anusha S
@@ -9,259 +9,123 @@ exports[`Addons renders correctly 1`] = `
|
||||
>
|
||||
Add-ons
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
<AddonsItem
|
||||
Options={
|
||||
<CustomizeOptions
|
||||
CustomizationOptions={
|
||||
<CustomizeBadge
|
||||
badgeOptions={
|
||||
Object {
|
||||
"badgeColor": "0e75b6",
|
||||
"badgeLabel": "Profile views",
|
||||
"badgeStyle": "flat",
|
||||
}
|
||||
}
|
||||
githubName=""
|
||||
onBadgeUpdate={[Function]}
|
||||
/>
|
||||
}
|
||||
title="Customize Badge"
|
||||
/>
|
||||
}
|
||||
inputChecked={false}
|
||||
inputId="visitors-count"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="visitors-count"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="visitors-count"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display visitors count badge
|
||||
</span>
|
||||
</label>
|
||||
<button
|
||||
className="flex ml-3 focus:bg-gray-400"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"outline": "none",
|
||||
}
|
||||
}
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
className="transform scale-100 md:scale-125"
|
||||
dangerouslySetInnerHTML={
|
||||
Object {
|
||||
"__html": "<path fill-rule=\\"evenodd\\" d=\\"M5.433 2.304A4.494 4.494 0 003.5 6c0 1.598.832 3.002 2.09 3.802.518.328.929.923.902 1.64v.008l-.164 3.337a.75.75 0 11-1.498-.073l.163-3.33c.002-.085-.05-.216-.207-.316A5.996 5.996 0 012 6a5.994 5.994 0 012.567-4.92 1.482 1.482 0 011.673-.04c.462.296.76.827.76 1.423v2.82c0 .082.041.16.11.206l.75.51a.25.25 0 00.28 0l.75-.51A.25.25 0 009 5.282V2.463c0-.596.298-1.127.76-1.423a1.482 1.482 0 011.673.04A5.994 5.994 0 0114 6a5.996 5.996 0 01-2.786 5.068c-.157.1-.209.23-.207.315l.163 3.33a.75.75 0 11-1.498.074l-.164-3.345c-.027-.717.384-1.312.902-1.64A4.496 4.496 0 0012.5 6a4.494 4.494 0 00-1.933-3.696c-.024.017-.067.067-.067.16v2.818a1.75 1.75 0 01-.767 1.448l-.75.51a1.75 1.75 0 01-1.966 0l-.75-.51A1.75 1.75 0 015.5 5.282V2.463c0-.092-.043-.142-.067-.159zm.01-.005z\\"></path>",
|
||||
}
|
||||
}
|
||||
fill="currentColor"
|
||||
height={16}
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"display": "inline-block",
|
||||
"userSelect": "none",
|
||||
"verticalAlign": "text-bottom",
|
||||
}
|
||||
}
|
||||
viewBox="0 0 16 16"
|
||||
width={16}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
display visitors count badge
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
inputChecked={false}
|
||||
inputId="github-profile-trophy"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="github-profile-trophy"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="github-profile-trophy"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display github trophy
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="github-stats"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="github-stats"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display github profile stats card
|
||||
</span>
|
||||
</label>
|
||||
<button
|
||||
className="flex ml-3 focus:bg-gray-400"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"outline": "none",
|
||||
display github trophy
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
Options={
|
||||
<CustomizeOptions
|
||||
CustomizationOptions={
|
||||
<CustomizeGithubStatsBase
|
||||
onUpdate={[Function]}
|
||||
options={
|
||||
Object {
|
||||
"bgColor": "",
|
||||
"cacheSeconds": null,
|
||||
"hideBorder": false,
|
||||
"locale": "en",
|
||||
"textColor": "",
|
||||
"theme": "",
|
||||
"titleColor": "",
|
||||
}
|
||||
}
|
||||
prefix="stats"
|
||||
/>
|
||||
}
|
||||
}
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
className="transform scale-100 md:scale-125"
|
||||
dangerouslySetInnerHTML={
|
||||
Object {
|
||||
"__html": "<path fill-rule=\\"evenodd\\" d=\\"M5.433 2.304A4.494 4.494 0 003.5 6c0 1.598.832 3.002 2.09 3.802.518.328.929.923.902 1.64v.008l-.164 3.337a.75.75 0 11-1.498-.073l.163-3.33c.002-.085-.05-.216-.207-.316A5.996 5.996 0 012 6a5.994 5.994 0 012.567-4.92 1.482 1.482 0 011.673-.04c.462.296.76.827.76 1.423v2.82c0 .082.041.16.11.206l.75.51a.25.25 0 00.28 0l.75-.51A.25.25 0 009 5.282V2.463c0-.596.298-1.127.76-1.423a1.482 1.482 0 011.673.04A5.994 5.994 0 0114 6a5.996 5.996 0 01-2.786 5.068c-.157.1-.209.23-.207.315l.163 3.33a.75.75 0 11-1.498.074l-.164-3.345c-.027-.717.384-1.312.902-1.64A4.496 4.496 0 0012.5 6a4.494 4.494 0 00-1.933-3.696c-.024.017-.067.067-.067.16v2.818a1.75 1.75 0 01-.767 1.448l-.75.51a1.75 1.75 0 01-1.966 0l-.75-.51A1.75 1.75 0 015.5 5.282V2.463c0-.092-.043-.142-.067-.159zm.01-.005z\\"></path>",
|
||||
}
|
||||
}
|
||||
fill="currentColor"
|
||||
height={16}
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"display": "inline-block",
|
||||
"userSelect": "none",
|
||||
"verticalAlign": "text-bottom",
|
||||
}
|
||||
}
|
||||
viewBox="0 0 16 16"
|
||||
width={16}
|
||||
title="Customize Github Stats Card"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
}
|
||||
inputChecked={false}
|
||||
inputId="github-stats"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="top-languages"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="top-languages"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display top skills
|
||||
</span>
|
||||
</label>
|
||||
<button
|
||||
className="flex ml-3 focus:bg-gray-400"
|
||||
onClick={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"outline": "none",
|
||||
display github profile stats card
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
Options={
|
||||
<CustomizeOptions
|
||||
CustomizationOptions={
|
||||
<CustomizeGithubStatsBase
|
||||
onUpdate={[Function]}
|
||||
options={
|
||||
Object {
|
||||
"bgColor": "",
|
||||
"cacheSeconds": null,
|
||||
"hideBorder": false,
|
||||
"locale": "en",
|
||||
"textColor": "",
|
||||
"theme": "",
|
||||
"titleColor": "",
|
||||
}
|
||||
}
|
||||
prefix="top-lang"
|
||||
/>
|
||||
}
|
||||
}
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
className="transform scale-100 md:scale-125"
|
||||
dangerouslySetInnerHTML={
|
||||
Object {
|
||||
"__html": "<path fill-rule=\\"evenodd\\" d=\\"M5.433 2.304A4.494 4.494 0 003.5 6c0 1.598.832 3.002 2.09 3.802.518.328.929.923.902 1.64v.008l-.164 3.337a.75.75 0 11-1.498-.073l.163-3.33c.002-.085-.05-.216-.207-.316A5.996 5.996 0 012 6a5.994 5.994 0 012.567-4.92 1.482 1.482 0 011.673-.04c.462.296.76.827.76 1.423v2.82c0 .082.041.16.11.206l.75.51a.25.25 0 00.28 0l.75-.51A.25.25 0 009 5.282V2.463c0-.596.298-1.127.76-1.423a1.482 1.482 0 011.673.04A5.994 5.994 0 0114 6a5.996 5.996 0 01-2.786 5.068c-.157.1-.209.23-.207.315l.163 3.33a.75.75 0 11-1.498.074l-.164-3.345c-.027-.717.384-1.312.902-1.64A4.496 4.496 0 0012.5 6a4.494 4.494 0 00-1.933-3.696c-.024.017-.067.067-.067.16v2.818a1.75 1.75 0 01-.767 1.448l-.75.51a1.75 1.75 0 01-1.966 0l-.75-.51A1.75 1.75 0 015.5 5.282V2.463c0-.092-.043-.142-.067-.159zm.01-.005z\\"></path>",
|
||||
}
|
||||
}
|
||||
fill="currentColor"
|
||||
height={16}
|
||||
role="img"
|
||||
style={
|
||||
Object {
|
||||
"display": "inline-block",
|
||||
"userSelect": "none",
|
||||
"verticalAlign": "text-bottom",
|
||||
}
|
||||
}
|
||||
viewBox="0 0 16 16"
|
||||
width={16}
|
||||
title="Customize Top Skills Card"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
}
|
||||
inputChecked={false}
|
||||
inputId="top-languages"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="twitter-badge"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="twitter-badge"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display twitter badge
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
display top skills
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
inputChecked={false}
|
||||
inputId="twitter-badge"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="dev-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="dev-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display latest dev.to blogs dynamically (GitHub Action)
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
display twitter badge
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
inputChecked={false}
|
||||
inputId="dev-dynamic-blogs"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="medium-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="medium-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display latest medium blogs dynamically (GitHub Action)
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
<div
|
||||
className="py-2 flex justify-start items-center text-sm sm:text-lg"
|
||||
display latest dev.to blogs dynamically (GitHub Action)
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
inputChecked={false}
|
||||
inputId="medium-dynamic-blogs"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
<label
|
||||
className="cursor-pointer flex items-center"
|
||||
htmlFor="rss-dynamic-blogs"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
id="rss-dynamic-blogs"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<span
|
||||
className="pl-4"
|
||||
>
|
||||
display latest blogs from your personal blog dynamically (GitHub Action)
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
display latest medium blogs dynamically (GitHub Action)
|
||||
</AddonsItem>
|
||||
<AddonsItem
|
||||
inputChecked={false}
|
||||
inputId="rss-dynamic-blogs"
|
||||
onInputChange={[Function]}
|
||||
>
|
||||
display latest blogs from your personal blog dynamically (GitHub Action)
|
||||
</AddonsItem>
|
||||
</div>
|
||||
`;
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import React from "react"
|
||||
import renderer from "react-test-renderer"
|
||||
import toJson from "enzyme-to-json"
|
||||
import { shallow } from "enzyme"
|
||||
|
||||
import Addons from "../addons"
|
||||
|
||||
@@ -82,14 +83,13 @@ describe("Addons", () => {
|
||||
});
|
||||
|
||||
it("renders correctly", () => {
|
||||
const tree = renderer
|
||||
.create(<Addons
|
||||
data={dataInput}
|
||||
social={socialInput}
|
||||
handleCheckChange={mockHandleCheckChange}
|
||||
handleDataChange={mockHandleDataChange}
|
||||
/>)
|
||||
.toJSON()
|
||||
expect(tree).toMatchSnapshot();
|
||||
const addOnComponent = shallow(<Addons
|
||||
data={dataInput}
|
||||
social={socialInput}
|
||||
handleCheckChange={mockHandleCheckChange}
|
||||
handleDataChange={mockHandleDataChange}
|
||||
/>);
|
||||
|
||||
expect(toJson(addOnComponent)).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user