Compare commits

..

8 Commits

Author SHA1 Message Date
zolostays 1d672fe879 [fix]: readme and package.json 2020-10-28 11:32:39 +05:30
Kate Dainovich e29ddc1637 Merge pull request #314 from anusha5695/ISSUE-294 2020-10-27 18:25:01 +03:00
Rahul Jain a18dc59933 Merge pull request #327 from rahuldkjain/new-sponsors
[add]: new sponsors
2020-10-27 11:05:20 +05:30
Anusha S a93d958944 tech: add more test cases for coverage 2020-10-27 01:50:39 +05:30
anusha5695 12315be78b Merge branch 'master' into ISSUE-294 2020-10-26 21:31:00 +05:30
Anusha S 3d296812e8 tech: use enzyme to json instead of react test renderer 2020-10-26 12:42:37 +05:30
Citrinin d82a367616 fix tests & update config 2020-10-26 12:42:37 +05:30
Anusha S eafa964cb9 tech: add snapshot test for add ons component 2020-10-24 14:18:03 +05:30
7 changed files with 3528 additions and 64 deletions
-26
View File
@@ -158,32 +158,6 @@ Please read [`CONTRIBUTING`](CONTRIBUTING.md) for details on our [`CODE OF CONDU
<a href="https://www.buymeacoffee.com/rahuldkjain" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="23" width="100" style="border-radius:2px" />
</p>
## Contributors ✨
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
[![All Contributors](https://img.shields.io/badge/all_contributors-9-orange.svg?style=flat-square)](#contributors-)
<!-- ALL-CONTRIBUTORS-BADGE:END -->
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore-start -->
<!-- markdownlint-disable -->
<table>
<tr>
<td align="center"><a href="https://github.com/sarbikbetal"><img src="https://avatars2.githubusercontent.com/u/41508422?v=4" width="100px;" alt=""/><br /><sub><b>Sarbik Betal</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=sarbikbetal" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/Hardik0307"><img src="https://avatars3.githubusercontent.com/u/41434099?v=4" width="100px;" alt=""/><br /><sub><b>Hardik Bagada</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=Hardik0307" title="Code">💻</a></td>
<td align="center"><a href="https://komarev.com"><img src="https://avatars0.githubusercontent.com/u/1849174?v=4" width="100px;" alt=""/><br /><sub><b>Anton Komarev</b></sub></a><br /><a href="#plugin-antonkomarev" title="Plugin/utility libraries">🔌</a></td>
<td align="center"><a href="https://kkvanonymous.github.io/"><img src="https://avatars3.githubusercontent.com/u/58628586?v=4" width="100px;" alt=""/><br /><sub><b>Kunal Kumar Verma</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=KKVANONYMOUS" title="Code">💻</a></td>
<td align="center"><a href="http://jaideepghosh.blogspot.com"><img src="https://avatars2.githubusercontent.com/u/3909648?v=4" width="100px;" alt=""/><br /><sub><b>Jaideep Ghosh</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=jaideepghosh" title="Code">💻</a></td>
<td align="center"><a href="http://yashkandalkar.github.io"><img src="https://avatars0.githubusercontent.com/u/35102959?v=4" width="100px;" alt=""/><br /><sub><b>yash</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=YashKandalkar" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/abhijit-hota"><img src="https://avatars0.githubusercontent.com/u/8116174?v=4" width="100px;" alt=""/><br /><sub><b>Abhijit Hota</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=abhijit-hota" title="Code">💻</a> <a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=abhijit-hota" title="Tests">⚠️</a></td>
<td align="center"><a href="https://maddoxx88.github.io/"><img src="https://avatars1.githubusercontent.com/u/34238672?v=4" width="100px;" alt=""/><br /><sub><b>Sunit Shirke</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=Maddoxx88" title="Code">💻</a></td>
<td align="center"><a href="https://www.gsavitha.in"><img src="https://avatars0.githubusercontent.com/u/31612459?v=4" width="100px;" alt=""/><br /><sub><b>Savitha Gollamudi</b></sub></a><br /><a href="https://github.com/rahuldkjain/github-profile-readme-generator/commits?author=g-savitha" title="Code">💻</a></td>
</tr>
</table>
<!-- markdownlint-enable -->
<!-- prettier-ignore-end -->
<!-- ALL-CONTRIBUTORS-LIST:END -->
<hr>
<p align="center">
+1
View File
@@ -10,6 +10,7 @@ module.exports = {
transformIgnorePatterns: [`node_modules/(?!(gatsby)/)`],
globals: {
__PATH_PREFIX__: ``,
__BASE_PATH__: ``,
},
setupFiles: [`<rootDir>/loadershim.js`],
setupFilesAfterEnv: ["<rootDir>/setupTests.js"],
+4 -4
View File
@@ -1,8 +1,8 @@
{
"name": "gh-profile-readme-generator",
"name": "github-profile-readme-generator",
"private": true,
"description": "A simple react app to generate beautiful github profile readme in md(markdown)",
"version": "0.1.0",
"version": "1.1.10",
"author": "Rahul Jain <rahuldkjain@gmail.com>",
"dependencies": {
"@primer/octicons-react": "^10.0.0",
@@ -56,9 +56,9 @@
},
"repository": {
"type": "git",
"url": "https://github.com/rahuldkjain/gh-profile-readme-generator"
"url": "https://github.com/rahuldkjain/github-profile-readme-generator"
},
"bugs": {
"url": "https://github.com/rahuldkjain/gh-profile-readme-generator/issues"
"url": "https://github.com/rahuldkjain/github-profile-readme-generator/issues"
}
}
File diff suppressed because it is too large Load Diff
@@ -1,69 +1,578 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`DisplaySocial Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`DisplaySocial Preview renders correctly 1`] = `
<a
className="no-underline text-blue-700 m-2"
href="https://codepen.io/dummy"
target="blank"
>
<img
alt="props.username"
className="w-6 h-6"
src="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codepen.svg"
/>
</a>
`;
exports[`DisplaySocial Preview renders correctly with no username 1`] = `ShallowWrapper {}`;
exports[`DisplaySocial Preview renders correctly with no username 1`] = `""`;
exports[`DisplayWork Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly 1`] = `
<div
className="my-2"
>
[object Object]
<a
className="no-underline text-blue-700"
href="https://dummy.com"
target="blank"
>
readme-generator
</a>
</div>
`;
exports[`DisplayWork Preview renders correctly with no link 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no link 1`] = `
<div
className="my-2"
>
[object Object]
<b>
readme-generator
</b>
</div>
`;
exports[`DisplayWork Preview renders correctly with no prefix 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no prefix 1`] = `""`;
exports[`DisplayWork Preview renders correctly with no prefix and link 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no prefix and link 1`] = `""`;
exports[`DisplayWork Preview renders correctly with no prefix, link and project 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no prefix, link and project 1`] = `""`;
exports[`DisplayWork Preview renders correctly with no project 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no project 1`] = `
<div
className="my-2"
>
[object Object]
<a
className="no-underline text-blue-700"
href="https://dummy.com"
target="blank"
>
https://dummy.com
</a>
</div>
`;
exports[`DisplayWork Preview renders correctly with no project and link 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no project and link 1`] = `""`;
exports[`DisplayWork Preview renders correctly with no project and prefix 1`] = `ShallowWrapper {}`;
exports[`DisplayWork Preview renders correctly with no project and prefix 1`] = `""`;
exports[`GitHubStats Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`GitHubStats Preview renders correctly 1`] = `""`;
exports[`GitHubStats Preview renders correctly 2`] = `ShallowWrapper {}`;
exports[`GitHubStats Preview renders correctly 2`] = `
<div
className="text-center mx-4 mb-4"
>
<img
alt=""
src="https://github-readme-stats.vercel.app/api?username=&show_icons=true&locale=en"
/>
</div>
`;
exports[`GithubProfileTrophy Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`GithubProfileTrophy Preview renders correctly 1`] = `""`;
exports[`GithubProfileTrophy Preview renders correctly with show true 1`] = `ShallowWrapper {}`;
exports[`GithubProfileTrophy Preview renders correctly with show true 1`] = `
<div
className="text-left my-2"
>
<a
href="https://github.com/ryo-ma/github-profile-trophy"
>
<img
alt=""
src="https://github-profile-trophy.vercel.app/?username="
/>
</a>
</div>
`;
exports[`Markdown Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`Markdown Preview renders correctly 1`] = `
<div
id="markdown-preview"
>
<TitlePreview
prefix="Hi 👋, I'm"
title="dummy"
/>
<SubTitlePreview
subtitle="A passionate frontend developer from India"
/>
<VisitorsBadgePreview
badgeOptions={
Object {
"badgeColor": "0e75b6",
"badgeLabel": "Profile%20views",
"badgeStyle": "flat",
}
}
github=""
show={false}
/>
<GithubProfileTrophyPreview
github=""
show={false}
/>
<TwitterBadgePreview
show={false}
twitter=""
/>
<WorkPreview
work={
Object {
"data": Object {
"ama": "",
"badgeColor": "0e75b6",
"badgeLabel": "Profile views",
"badgeStyle": "flat",
"collaborateOn": "",
"contact": "",
"currentLearn": "",
"currentWork": "readme-generator",
"devDynamicBlogs": false,
"funFact": "",
"githubProfileTrophy": false,
"githubStats": false,
"githubStatsOptions": Object {
"bgColor": "",
"cacheSeconds": null,
"hideBorder": false,
"locale": "en",
"textColor": "",
"theme": "",
"titleColor": "",
},
"helpWith": "",
"mediumDynamicBlogs": false,
"rssDynamicBlogs": false,
"subtitle": "A passionate frontend developer from India",
"title": "dummy",
"topLanguages": false,
"topLanguagesOptions": Object {
"bgColor": "",
"cacheSeconds": null,
"hideBorder": false,
"locale": "en",
"textColor": "",
"theme": "",
"titleColor": "",
},
"twitterBadge": false,
"visitorsBadge": false,
},
"link": Object {
"blog": "",
"collaborateOn": "",
"currentWork": "https://dummy.com",
"helpWith": "",
"portfolio": "",
"resume": "",
},
"prefix": Object {
"ama": "💬 Ask me about",
"blog": "📝 I regulary write articles on",
"collaborateOn": "👯 Im looking to collaborate on",
"contact": "📫 How to reach me",
"currentLearn": "🌱 Im currently learning",
"currentWork": "🔭 Im currently working on",
"funFact": "⚡ Fun fact",
"helpWith": "🤝 Im looking for help with",
"portfolio": "👨‍💻 All of my projects are available at",
"resume": "📄 Know about my experiences",
"title": "Hi 👋, I'm",
},
"skills": Object {},
"social": Object {
"behance": "",
"codechef": "",
"codeforces": "",
"codepen": "dummy",
"codesandbox": "",
"dev": "",
"discord": "",
"dribbble": "",
"fb": "",
"geeks_for_geeks": "",
"github": "",
"hackerearth": "",
"hackerrank": "",
"instagram": "",
"kaggle": "",
"leetcode": "",
"linkedin": "",
"medium": "",
"rssurl": "",
"stackoverflow": "",
"topcoder": "",
"twitter": "",
"youtube": "",
},
}
}
/>
<SocialPreview
social={
Object {
"behance": "",
"codechef": "",
"codeforces": "",
"codepen": "dummy",
"codesandbox": "",
"dev": "",
"discord": "",
"dribbble": "",
"fb": "",
"geeks_for_geeks": "",
"github": "",
"hackerearth": "",
"hackerrank": "",
"instagram": "",
"kaggle": "",
"leetcode": "",
"linkedin": "",
"medium": "",
"rssurl": "",
"stackoverflow": "",
"topcoder": "",
"twitter": "",
"youtube": "",
}
}
/>
<SkillsPreview
skills={Object {}}
/>
<div
className="block sm:flex sm:justify-center sm:items-start"
>
<TopLanguagesPreview
github=""
options={
Object {
"bgColor": "",
"cacheSeconds": null,
"hideBorder": false,
"locale": "en",
"textColor": "",
"theme": "",
"titleColor": "",
}
}
show={false}
/>
<GitHubStatsPreview
github=""
options={
Object {
"bgColor": "",
"cacheSeconds": null,
"hideBorder": false,
"locale": "en",
"textColor": "",
"theme": "",
"titleColor": "",
}
}
show={false}
/>
</div>
</div>
`;
exports[`SectionTitle Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`SectionTitle Preview renders correctly 1`] = `
<h3
className="w-full text-lg sm:text-xl"
>
dummy
</h3>
`;
exports[`SectionTitle Preview renders correctly with no label 1`] = `ShallowWrapper {}`;
exports[`SectionTitle Preview renders correctly with no label 1`] = `""`;
exports[`SectionTitle Preview renders correctly with visible false 1`] = `ShallowWrapper {}`;
exports[`SectionTitle Preview renders correctly with visible false 1`] = `""`;
exports[`Skills Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`Skills Preview renders correctly 1`] = `
<div
className="flex flex-wrap justify-start items-center"
>
<SectionTitle
label="Languages and Tools:"
visible={true}
/>
<a
href="https://unity.com/"
rel="noreferrer"
target="_blank"
>
<img
alt="unity"
className="mb-4 mr-4 h-6 w-6 sm:h-10 sm:w-10"
key="unity"
src="https://www.vectorlogo.zone/logos/unity3d/unity3d-icon.svg"
/>
</a>
</div>
`;
exports[`Skills Preview renders correctly with no skills 1`] = `ShallowWrapper {}`;
exports[`Skills Preview renders correctly with no skills 1`] = `""`;
exports[`Social Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`Social Preview renders correctly 1`] = `
<div
className="flex justify-start items-end flex-wrap"
>
<SectionTitle
label="Connect with me:"
visible={true}
/>
<DisplaySocial
base="https://codepen.io"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codepen.svg"
username="dummy"
/>
<DisplaySocial
base="https://dev.to"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/dev-dot-to.svg"
username=""
/>
<DisplaySocial
base="https://twitter.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/twitter.svg"
username=""
/>
<DisplaySocial
base="https://linkedin.com/in"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/linkedin.svg"
username=""
/>
<DisplaySocial
base="https://stackoverflow.com/users"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/stackoverflow.svg"
username=""
/>
<DisplaySocial
base="https://codesandbox.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codesandbox.svg"
username=""
/>
<DisplaySocial
base="https://kaggle.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/kaggle.svg"
username=""
/>
<DisplaySocial
base="https://fb.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/facebook.svg"
username=""
/>
<DisplaySocial
base="https://instagram.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/instagram.svg"
username=""
/>
<DisplaySocial
base="https://dribbble.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/dribbble.svg"
username=""
/>
<DisplaySocial
base="https://www.behance.net"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/behance.svg"
username=""
/>
<DisplaySocial
base="https://medium.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/medium.svg"
username=""
/>
<DisplaySocial
base="https://www.youtube.com/c"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/youtube.svg"
username=""
/>
<DisplaySocial
base="https://www.codechef.com/users"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codechef.svg"
username=""
/>
<DisplaySocial
base="https://codeforces.com/profile"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codeforces.svg"
username=""
/>
<DisplaySocial
base="https://www.hackerrank.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/hackerrank.svg"
username=""
/>
<DisplaySocial
base="https://auth.geeksforgeeks.org/user"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/geeksforgeeks.svg"
username=""
/>
<DisplaySocial
base="https://www.hackerearth.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/hackerearth.svg"
username=""
/>
<DisplaySocial
base="https://www.topcoder.com/members"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/topcoder.svg"
username=""
/>
<DisplaySocial
base="https://www.leetcode.com"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/leetcode.svg"
username=""
/>
<DisplaySocial
base="https://discord.gg"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/discord.svg"
username=""
/>
<DisplaySocial
base=""
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/rss.svg"
username=""
/>
</div>
`;
exports[`SubTitle Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`SubTitle Preview renders correctly 1`] = `
<h3
className="text-center font-medium"
>
A passionate frontend developer from India
</h3>
`;
exports[`SubTitle Preview renders correctly with no subtitle 1`] = `ShallowWrapper {}`;
exports[`SubTitle Preview renders correctly with no subtitle 1`] = `""`;
exports[`Title Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`Title Preview renders correctly 1`] = `
<h1
className="text-center text-xl font-bold"
>
Hi 👋, I'm dummy
</h1>
`;
exports[`Title Preview renders correctly with no prefix 1`] = `ShallowWrapper {}`;
exports[`Title Preview renders correctly with no prefix 1`] = `""`;
exports[`Title Preview renders correctly with no title 1`] = `ShallowWrapper {}`;
exports[`Title Preview renders correctly with no title 1`] = `""`;
exports[`Title Preview renders correctly with no title and prefix 1`] = `ShallowWrapper {}`;
exports[`Title Preview renders correctly with no title and prefix 1`] = `""`;
exports[`TopLanguages Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`TopLanguages Preview renders correctly 1`] = `
<div
className="text-center mx-4 mb-4"
>
 
</div>
`;
exports[`TopLanguages Preview renders correctly with show true 1`] = `ShallowWrapper {}`;
exports[`TopLanguages Preview renders correctly with show true 1`] = `
<div
className="text-center mx-4 mb-4"
>
<img
alt=""
src="https://github-readme-stats.vercel.app/api/top-langs?username=&show_icons=true&locale=en&layout=compact"
/>
</div>
`;
exports[`TwitterBadgePreview Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`TwitterBadgePreview Preview renders correctly 1`] = `""`;
exports[`TwitterBadgePreview Preview renders correctly with show true 1`] = `ShallowWrapper {}`;
exports[`TwitterBadgePreview Preview renders correctly with show true 1`] = `
<div
className="text-left my-2"
>
<a
href="https://twitter.com/\${props.twitter}"
target="blank"
>
<img
alt=""
className="h-4 sm:h-6"
src="https://img.shields.io/twitter/follow/?logo=twitter&style=for-the-badge"
/>
</a>
</div>
`;
exports[`VisitorsBadge Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`VisitorsBadge Preview renders correctly 1`] = `""`;
exports[`VisitorsBadge Preview renders correctly with show true 1`] = `ShallowWrapper {}`;
exports[`VisitorsBadge Preview renders correctly with show true 1`] = `
<div
className="text-left my-2"
>
<img
alt=""
className="h-4 sm:h-6"
src="https://komarev.com/ghpvc/?username=&label=Profile%20views&color=0e75b6&style=flat"
/>
</div>
`;
exports[`Work Preview renders correctly 1`] = `ShallowWrapper {}`;
exports[`Work Preview renders correctly 1`] = `
<Fragment>
<DisplayWork
link="https://dummy.com"
prefix="🔭 Im currently working on"
project="readme-generator"
/>
<DisplayWork
prefix="🌱 Im currently learning"
project=""
/>
<DisplayWork
link=""
prefix="🤝 Im looking for help with"
project=""
/>
<DisplayWork
link=""
prefix="👯 Im looking to collaborate on"
project=""
/>
<DisplayWork
prefix="💬 Ask me about"
project=""
/>
<DisplayWork
link=""
prefix="👨‍💻 All of my projects are available at"
/>
<DisplayWork
link=""
prefix="📝 I regulary write articles on"
/>
<DisplayWork
link=""
prefix="📄 Know about my experiences"
/>
<DisplayWork
prefix="📫 How to reach me"
project=""
/>
<DisplayWork
prefix="⚡ Fun fact"
project=""
/>
</Fragment>
`;
+766
View File
@@ -0,0 +1,766 @@
import React from "react"
import toJson from "enzyme-to-json"
import { shallow, mount } from "enzyme"
import Addons from "../addons"
jest.useFakeTimers();
describe("Addons", () => {
const dataInput = {
title: "",
subtitle: "A passionate frontend developer from India",
currentWork: "",
currentLearn: "",
collaborateOn: "",
helpWith: "",
ama: "",
contact: "",
funFact: "",
twitterBadge: false,
visitorsBadge: false,
badgeStyle: "flat",
badgeColor: "0e75b6",
badgeLabel: "Profile views",
githubProfileTrophy: false,
githubStats: false,
githubStatsOptions: {
theme: "",
titleColor: "",
textColor: "",
bgColor: "",
hideBorder: false,
cacheSeconds: null,
locale: "en",
},
topLanguages: false,
topLanguagesOptions: {
theme: "",
titleColor: "",
textColor: "",
bgColor: "",
hideBorder: false,
cacheSeconds: null,
locale: "en",
},
devDynamicBlogs: false,
mediumDynamicBlogs: false,
rssDynamicBlogs: false,
};
const socialInput = {
github: "",
dev: "",
linkedin: "",
codepen: "",
stackoverflow: "",
kaggle: "",
codesandbox: "",
fb: "",
instagram: "",
twitter: "",
dribbble: "",
behance: "",
medium: "",
youtube: "",
codechef: "",
hackerrank: "",
codeforces: "",
leetcode: "",
topcoder: "",
hackerearth: "",
geeks_for_geeks: "",
discord: "",
rssurl: "",
};
let mockHandleCheckChange;
let mockHandleDataChange;
beforeEach(() => {
mockHandleCheckChange = jest.fn();
mockHandleDataChange = jest.fn();
});
afterEach(() => {
jest.clearAllMocks();
});
it("renders correctly", () => {
const addOnComponent = shallow(<Addons
data={dataInput}
social={socialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
expect(toJson(addOnComponent)).toMatchSnapshot();
});
it("should render Customize Badges", () => {
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#visitors-count-open-btn").simulate("click",{});
expect(addOnComponent).toMatchSnapshot();
});
it("should handle data change when badge style is changed", () => {
const mockEvent = { target: { value: "style-new" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "title-abcd",
textColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
locale: "en",
},
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#visitors-count-open-btn").simulate("click",{});
addOnComponent.find("#badge-style").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('badgeStyle',{target: {value: "style-new" }});
});
it("should handle data change when badge color is changed", () => {
const mockEvent = { target: { value: "new-color-abcd" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#visitors-count-open-btn").simulate("click",{});
addOnComponent.find("#badge-color").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('badgeColor',{target: {value: "new-color-abcd" }});
});
it("should handle data change when badge-label-text is changed", () => {
const mockEvent = { target: { value: "label-abcd-random" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#visitors-count-open-btn").simulate("click",{});
addOnComponent.find("#badge-label-text").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('badgeLabel',{target: {value: "label-abcd-random" }});
});
it("should render Customize Github stats card", () => {
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
expect(addOnComponent).toMatchSnapshot();
});
it("should handle data change when stats theme is changed", () => {
const mockEvent = { target: { value: "new-theme-for-stats" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
titleColor: "title-abcd",
textColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-theme").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "title-abcd",
textColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
});
it("should handle data change when stats title color is changed", () => {
const mockEvent = { target: { value: "red-color" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
textColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-title-color").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "red-color",
textColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
});
it("should handle data change when stats bg color is changed", () => {
const mockEvent = { target: { value: "random-color" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-bg-color").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
});
it("should handle data change when stats cache seconds is changed", () => {
const mockEvent = { target: { value: 1900 } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-cache-seconds").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: 1900,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
});
it("should handle data change when stats text color is changed", () => {
const mockEvent = { target: { value: "black-color" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "some-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-text-color").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "some-color",
textColor: "black-color",
bgColor: "abcd",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
});
it("should handle data change when stats local is changed", () => {
const mockEvent = { target: { value: 'uk' } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click", {});
addOnComponent.find("#stats-locale").simulate("change", mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "uk",
}
}
});
});
it("should handle data change when stats local is changed", () => {
const mockEvent = { target: { checked: true } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
githubStatsOptions: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: false,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#github-stats-open-btn").simulate("click",{});
addOnComponent.find("#stats-hide-border").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('githubStatsOptions', {
target: {
value: {
theme: "theme-1",
titleColor: "some-color",
textColor: "abcd",
bgColor: "random-color",
hideBorder: true,
cacheSeconds: null,
theme: "new-theme-for-stats",
locale: "en",
}
}
});
})
it("should render Customize Top Skills Card", () => {
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#top-languages-open-btn").simulate("click",{});
expect(addOnComponent).toMatchSnapshot();
});
it("should handle data change when top skills theme is changed", () => {
const mockEvent = { target: { value: "theme-xyz" } }
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value",
topLanguagesOptions : {
theme: "theme-2",
titleColor: "title-abcd-new",
textColor: "random-some-color",
bgColor: "1234",
hideBorder: false,
cacheSeconds: null,
theme: "theme-xyz",
locale: "us",
}
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = mount(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#top-languages-open-btn").simulate("click",{});
addOnComponent.find("#top-lang-theme").simulate("change",mockEvent);
jest.runAllTimers();
expect(mockHandleDataChange).toHaveBeenCalledTimes(1);
expect(mockHandleDataChange).toHaveBeenCalledWith('topLanguagesOptions', {
target: {
value: {
theme: "theme-2",
titleColor: "title-abcd-new",
textColor: "random-some-color",
bgColor: "1234",
hideBorder: false,
cacheSeconds: null,
theme: "theme-xyz",
locale: "us",
}
}
});
});
it("should handle check change when add on item inputs are changed", () => {
const mockEvent = { target: { value: "This is a mock event" } }
const addOnComponent = mount(<Addons
data={dataInput}
social={socialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#visitors-count").simulate("change", mockEvent);
addOnComponent.find("#github-profile-trophy").simulate("change", mockEvent);
addOnComponent.find("#github-stats").simulate("change", mockEvent);
addOnComponent.find("#top-languages").simulate("change", mockEvent);
addOnComponent.find("#twitter-badge").simulate("change", mockEvent);
addOnComponent.find("#dev-dynamic-blogs").simulate("change", mockEvent);
addOnComponent.find("#rss-dynamic-blogs").simulate("change", mockEvent);
addOnComponent.find("#medium-dynamic-blogs").simulate("change", mockEvent);
expect(mockHandleCheckChange).toHaveBeenCalledTimes(8);
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(1,"visitorsBadge");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(2,"githubProfileTrophy");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(3,"githubStats");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(4,"topLanguages");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(5,"twitterBadge");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(6,"devDynamicBlogs");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(7,"rssDynamicBlogs");
expect(mockHandleCheckChange).toHaveBeenNthCalledWith(8,"mediumDynamicBlogs");
});
it("should display workflow details if devDynamicBlogs and dev social data are available", () => {
const newDataInput = {
...dataInput,
devDynamicBlogs: "some-value"
};
const newSocialInput = {
dev: "some-value-123",
};
const addOnComponent = shallow(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
const workflowElement = addOnComponent.find(".workflow");
expect(workflowElement).toMatchSnapshot();
});
it("should display workflow details if rssDynamicBlogs and rss url data are available", () => {
const newDataInput = {
...dataInput,
rssDynamicBlogs: "some-rss-value"
};
const newSocialInput = {
rssurl: "url-random",
};
const addOnComponent = shallow(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
const workflowElement = addOnComponent.find(".workflow");
expect(workflowElement).toMatchSnapshot();
});
it("should display workflow details if mediumDynamicBlogs, medium social data are available", () => {
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = shallow(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
const workflowElement = addOnComponent.find(".workflow");
expect(workflowElement).toMatchSnapshot();
});
it("should call document create element when blog post workflow is clicked", () => {
let someElement = document.createElement("abcd");
document.createElement = jest.fn().mockReturnValueOnce(someElement);
const newDataInput = {
...dataInput,
mediumDynamicBlogs: "some-medium-blogs-value"
};
const newSocialInput = {
medium: "@abcd",
};
const addOnComponent = shallow(<Addons
data={newDataInput}
social={newSocialInput}
handleCheckChange={mockHandleCheckChange}
handleDataChange={mockHandleDataChange}
/>);
addOnComponent.find("#blog-post-worklow-span").simulate("click", {});
expect(document.createElement).toHaveBeenCalledTimes(1);
});
});
+2
View File
@@ -23,6 +23,7 @@ const AddonsItem = ({ inputId, inputChecked, onInputChange, Options, onIconClick
</label>
{Options && (
<button
id={`${inputId}-open-btn`}
onClick={() => setOpen(!open)}
className="flex ml-3 focus:bg-gray-400"
style={{ outline: "none" }}
@@ -370,6 +371,7 @@ const Addons = props => {
<div>
download
<span
id="blog-post-worklow-span"
onClick={blogPostPorkflow}
onKeyDown={(e) => e.keyCode === 13 && blogPostPorkflow()}
role="button"