move files back and adapt most paths
This commit is contained in:
martin-mfg
@@ -0,0 +1,307 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Test Render WakaTime Card should render correctly 1`] = `[Function]`;
|
||||
|
||||
exports[`Test Render WakaTime Card should render correctly with compact layout 1`] = `
|
||||
"
|
||||
<svg
|
||||
width="495"
|
||||
height="115"
|
||||
viewBox="0 0 495 115"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
role="img"
|
||||
aria-labelledby="descId"
|
||||
>
|
||||
<title id="titleId"></title>
|
||||
<desc id="descId"></desc>
|
||||
<style>
|
||||
.header {
|
||||
font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif;
|
||||
fill: #2f80ed;
|
||||
animation: fadeInAnimation 0.8s ease-in-out forwards;
|
||||
}
|
||||
@supports(-moz-appearance: auto) {
|
||||
/* Selector detects Firefox */
|
||||
.header { font-size: 15.5px; }
|
||||
}
|
||||
|
||||
|
||||
.stat {
|
||||
font: 600 14px 'Segoe UI', Ubuntu, "Helvetica Neue", Sans-Serif; fill: #434d58;
|
||||
}
|
||||
@supports(-moz-appearance: auto) {
|
||||
/* Selector detects Firefox */
|
||||
.stat { font-size:12px; }
|
||||
}
|
||||
.stagger {
|
||||
opacity: 0;
|
||||
animation: fadeInAnimation 0.3s ease-in-out forwards;
|
||||
}
|
||||
.not_bold { font-weight: 400 }
|
||||
.bold { font-weight: 700 }
|
||||
|
||||
@keyframes slideInAnimation {
|
||||
from {
|
||||
width: 0;
|
||||
}
|
||||
to {
|
||||
width: calc(100%-100px);
|
||||
}
|
||||
}
|
||||
@keyframes growWidthAnimation {
|
||||
from {
|
||||
width: 0;
|
||||
}
|
||||
to {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.lang-name { font: 400 11px 'Segoe UI', Ubuntu, Sans-Serif; fill: #434d58 }
|
||||
#rect-mask rect{
|
||||
animation: slideInAnimation 1s ease-in-out forwards;
|
||||
}
|
||||
.lang-progress{
|
||||
animation: growWidthAnimation 0.6s ease-in-out forwards;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<rect
|
||||
data-testid="card-bg"
|
||||
x="0.5"
|
||||
y="0.5"
|
||||
rx="4.5"
|
||||
height="99%"
|
||||
stroke="#e4e2e2"
|
||||
width="494"
|
||||
fill="#fffefe"
|
||||
stroke-opacity="1"
|
||||
/>
|
||||
|
||||
|
||||
<g
|
||||
data-testid="card-title"
|
||||
transform="translate(25, 35)"
|
||||
>
|
||||
<g transform="translate(0, 0)">
|
||||
<text
|
||||
x="0"
|
||||
y="0"
|
||||
class="header"
|
||||
data-testid="header"
|
||||
>WakaTime Stats (last 7 days)</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
|
||||
<g
|
||||
data-testid="main-card-body"
|
||||
transform="translate(0, 55)"
|
||||
>
|
||||
|
||||
<svg x="0" y="0" width="100%">
|
||||
|
||||
<mask id="rect-mask">
|
||||
<rect x="25" y="0" width="440" height="8" fill="white" rx="5" />
|
||||
</mask>
|
||||
|
||||
<rect
|
||||
mask="url(#rect-mask)"
|
||||
data-testid="lang-progress"
|
||||
x="0"
|
||||
y="0"
|
||||
width="415.61699999999996"
|
||||
height="8"
|
||||
fill="#858585"
|
||||
/>
|
||||
|
||||
<rect
|
||||
mask="url(#rect-mask)"
|
||||
data-testid="lang-progress"
|
||||
x="415.61699999999996"
|
||||
y="0"
|
||||
width="29.0625"
|
||||
height="8"
|
||||
fill="#3178c6"
|
||||
/>
|
||||
|
||||
|
||||
<g transform="translate(25, 25)">
|
||||
<circle cx="5" cy="6" r="5" fill="#858585" />
|
||||
<text data-testid="lang-name" x="15" y="10" class='lang-name'>
|
||||
Other - 19 mins
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(230, 25)">
|
||||
<circle cx="5" cy="6" r="5" fill="#3178c6" />
|
||||
<text data-testid="lang-name" x="15" y="10" class='lang-name'>
|
||||
TypeScript - 1 min
|
||||
</text>
|
||||
</g>
|
||||
|
||||
|
||||
</svg>
|
||||
|
||||
</g>
|
||||
</svg>
|
||||
"
|
||||
`;
|
||||
|
||||
exports[`Test Render WakaTime Card should render correctly with compact layout when langs_count is set 1`] = `
|
||||
"
|
||||
<svg
|
||||
width="495"
|
||||
height="115"
|
||||
viewBox="0 0 495 115"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
role="img"
|
||||
aria-labelledby="descId"
|
||||
>
|
||||
<title id="titleId"></title>
|
||||
<desc id="descId"></desc>
|
||||
<style>
|
||||
.header {
|
||||
font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif;
|
||||
fill: #2f80ed;
|
||||
animation: fadeInAnimation 0.8s ease-in-out forwards;
|
||||
}
|
||||
@supports(-moz-appearance: auto) {
|
||||
/* Selector detects Firefox */
|
||||
.header { font-size: 15.5px; }
|
||||
}
|
||||
|
||||
|
||||
.stat {
|
||||
font: 600 14px 'Segoe UI', Ubuntu, "Helvetica Neue", Sans-Serif; fill: #434d58;
|
||||
}
|
||||
@supports(-moz-appearance: auto) {
|
||||
/* Selector detects Firefox */
|
||||
.stat { font-size:12px; }
|
||||
}
|
||||
.stagger {
|
||||
opacity: 0;
|
||||
animation: fadeInAnimation 0.3s ease-in-out forwards;
|
||||
}
|
||||
.not_bold { font-weight: 400 }
|
||||
.bold { font-weight: 700 }
|
||||
|
||||
@keyframes slideInAnimation {
|
||||
from {
|
||||
width: 0;
|
||||
}
|
||||
to {
|
||||
width: calc(100%-100px);
|
||||
}
|
||||
}
|
||||
@keyframes growWidthAnimation {
|
||||
from {
|
||||
width: 0;
|
||||
}
|
||||
to {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.lang-name { font: 400 11px 'Segoe UI', Ubuntu, Sans-Serif; fill: #434d58 }
|
||||
#rect-mask rect{
|
||||
animation: slideInAnimation 1s ease-in-out forwards;
|
||||
}
|
||||
.lang-progress{
|
||||
animation: growWidthAnimation 0.6s ease-in-out forwards;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<rect
|
||||
data-testid="card-bg"
|
||||
x="0.5"
|
||||
y="0.5"
|
||||
rx="4.5"
|
||||
height="99%"
|
||||
stroke="#e4e2e2"
|
||||
width="494"
|
||||
fill="#fffefe"
|
||||
stroke-opacity="1"
|
||||
/>
|
||||
|
||||
|
||||
<g
|
||||
data-testid="card-title"
|
||||
transform="translate(25, 35)"
|
||||
>
|
||||
<g transform="translate(0, 0)">
|
||||
<text
|
||||
x="0"
|
||||
y="0"
|
||||
class="header"
|
||||
data-testid="header"
|
||||
>WakaTime Stats (last 7 days)</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
|
||||
<g
|
||||
data-testid="main-card-body"
|
||||
transform="translate(0, 55)"
|
||||
>
|
||||
|
||||
<svg x="0" y="0" width="100%">
|
||||
|
||||
<mask id="rect-mask">
|
||||
<rect x="25" y="0" width="440" height="8" fill="white" rx="5" />
|
||||
</mask>
|
||||
|
||||
<rect
|
||||
mask="url(#rect-mask)"
|
||||
data-testid="lang-progress"
|
||||
x="0"
|
||||
y="0"
|
||||
width="436.4025"
|
||||
height="8"
|
||||
fill="#858585"
|
||||
/>
|
||||
|
||||
<rect
|
||||
mask="url(#rect-mask)"
|
||||
data-testid="lang-progress"
|
||||
x="436.4025"
|
||||
y="0"
|
||||
width="30.503999999999998"
|
||||
height="8"
|
||||
fill="#3178c6"
|
||||
/>
|
||||
|
||||
|
||||
<g transform="translate(25, 25)">
|
||||
<circle cx="5" cy="6" r="5" fill="#858585" />
|
||||
<text data-testid="lang-name" x="15" y="10" class='lang-name'>
|
||||
Other - 19 mins
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(230, 25)">
|
||||
<circle cx="5" cy="6" r="5" fill="#3178c6" />
|
||||
<text data-testid="lang-name" x="15" y="10" class='lang-name'>
|
||||
TypeScript - 1 min
|
||||
</text>
|
||||
</g>
|
||||
|
||||
|
||||
</svg>
|
||||
|
||||
</g>
|
||||
</svg>
|
||||
"
|
||||
`;
|
||||
@@ -0,0 +1,269 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import api from "../api/index.js";
|
||||
import { calculateRank } from "../src/calculateRank.js";
|
||||
import { renderStatsCard } from "../src/cards/stats-card.js";
|
||||
import { CONSTANTS, renderError } from "../src/common/utils.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const stats = {
|
||||
name: "Anurag Hazra",
|
||||
totalStars: 100,
|
||||
totalCommits: 200,
|
||||
totalIssues: 300,
|
||||
totalPRs: 400,
|
||||
totalPRsMerged: 320,
|
||||
mergedPRsPercentage: 80,
|
||||
totalReviews: 50,
|
||||
totalDiscussionsStarted: 10,
|
||||
totalDiscussionsAnswered: 40,
|
||||
contributedTo: 50,
|
||||
rank: null,
|
||||
};
|
||||
|
||||
stats.rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: stats.totalCommits,
|
||||
prs: stats.totalPRs,
|
||||
reviews: stats.totalReviews,
|
||||
issues: stats.totalIssues,
|
||||
repos: 1,
|
||||
stars: stats.totalStars,
|
||||
followers: 0,
|
||||
});
|
||||
|
||||
const data_stats = {
|
||||
data: {
|
||||
user: {
|
||||
name: stats.name,
|
||||
repositoriesContributedTo: { totalCount: stats.contributedTo },
|
||||
contributionsCollection: {
|
||||
totalCommitContributions: stats.totalCommits,
|
||||
totalPullRequestReviewContributions: stats.totalReviews,
|
||||
},
|
||||
pullRequests: { totalCount: stats.totalPRs },
|
||||
mergedPullRequests: { totalCount: stats.totalPRsMerged },
|
||||
openIssues: { totalCount: stats.totalIssues },
|
||||
closedIssues: { totalCount: 0 },
|
||||
followers: { totalCount: 0 },
|
||||
repositoryDiscussions: { totalCount: stats.totalDiscussionsStarted },
|
||||
repositoryDiscussionComments: {
|
||||
totalCount: stats.totalDiscussionsAnswered,
|
||||
},
|
||||
repositories: {
|
||||
totalCount: 1,
|
||||
nodes: [{ stargazers: { totalCount: 100 } }],
|
||||
pageInfo: {
|
||||
hasNextPage: false,
|
||||
endCursor: "cursor",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const error = {
|
||||
errors: [
|
||||
{
|
||||
type: "NOT_FOUND",
|
||||
path: ["user"],
|
||||
locations: [],
|
||||
message: "Could not fetch user",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
const faker = (query, data) => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
...query,
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, data);
|
||||
|
||||
return { req, res };
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/", () => {
|
||||
it("should test the request", async () => {
|
||||
const { req, res } = faker({}, data_stats);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(renderStatsCard(stats, { ...req.query }));
|
||||
});
|
||||
|
||||
it("should render error card on error", async () => {
|
||||
const { req, res } = faker({}, error);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
error.errors[0].message,
|
||||
"Make sure the provided username is not an organization",
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card in same theme as requested card", async () => {
|
||||
const { req, res } = faker({ theme: "merko" }, error);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
error.errors[0].message,
|
||||
"Make sure the provided username is not an organization",
|
||||
{ theme: "merko" },
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should get the query options", async () => {
|
||||
const { req, res } = faker(
|
||||
{
|
||||
username: "anuraghazra",
|
||||
hide: "issues,prs,contribs",
|
||||
show_icons: true,
|
||||
hide_border: true,
|
||||
line_height: 100,
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
},
|
||||
data_stats,
|
||||
);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderStatsCard(stats, {
|
||||
hide: ["issues", "prs", "contribs"],
|
||||
show_icons: true,
|
||||
hide_border: true,
|
||||
line_height: 100,
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
it("should set shorter cache when error", async () => {
|
||||
const { req, res } = faker({}, error);
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader.mock.calls).toEqual([
|
||||
["Content-Type", "image/svg+xml"],
|
||||
[
|
||||
"Cache-Control",
|
||||
`max-age=${CONSTANTS.ERROR_CACHE_SECONDS / 2}, s-maxage=${
|
||||
CONSTANTS.ERROR_CACHE_SECONDS
|
||||
}, stale-while-revalidate=${CONSTANTS.ONE_DAY}`,
|
||||
],
|
||||
]);
|
||||
});
|
||||
|
||||
it("should allow changing ring_color", async () => {
|
||||
const { req, res } = faker(
|
||||
{
|
||||
username: "anuraghazra",
|
||||
hide: "issues,prs,contribs",
|
||||
show_icons: true,
|
||||
hide_border: true,
|
||||
line_height: 100,
|
||||
title_color: "fff",
|
||||
ring_color: "0000ff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
},
|
||||
data_stats,
|
||||
);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderStatsCard(stats, {
|
||||
hide: ["issues", "prs", "contribs"],
|
||||
show_icons: true,
|
||||
hide_border: true,
|
||||
line_height: 100,
|
||||
title_color: "fff",
|
||||
ring_color: "0000ff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if username in blacklist", async () => {
|
||||
const { req, res } = faker({ username: "renovate-bot" }, data_stats);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "This username is blacklisted"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card when wrong locale is provided", async () => {
|
||||
const { req, res } = faker({ locale: "asdf" }, data_stats);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "Language not found"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card when include_all_commits true and upstream API fails", async () => {
|
||||
mock
|
||||
.onGet(
|
||||
"https://api.github.com/search/commits?per_page=1&q=author:anuraghazra",
|
||||
)
|
||||
.reply(200, { error: "Some test error message" });
|
||||
|
||||
const { req, res } = faker(
|
||||
{ username: "anuraghazra", include_all_commits: true },
|
||||
data_stats,
|
||||
);
|
||||
|
||||
await api(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
"Could not fetch data from GitHub REST API.",
|
||||
"Please try again later",
|
||||
),
|
||||
);
|
||||
// Received SVG output should not contain string "https://tiny.one/readme-stats"
|
||||
expect(res.send.mock.calls[0][0]).not.toContain(
|
||||
"https://tiny.one/readme-stats",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,76 @@
|
||||
import { benchmarkSuite } from "jest-bench";
|
||||
import api from "../../api/index.js";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { jest } from "@jest/globals";
|
||||
|
||||
const stats = {
|
||||
name: "Anurag Hazra",
|
||||
totalStars: 100,
|
||||
totalCommits: 200,
|
||||
totalIssues: 300,
|
||||
totalPRs: 400,
|
||||
totalPRsMerged: 320,
|
||||
mergedPRsPercentage: 80,
|
||||
totalReviews: 50,
|
||||
totalDiscussionsStarted: 10,
|
||||
totalDiscussionsAnswered: 40,
|
||||
contributedTo: 50,
|
||||
rank: null,
|
||||
};
|
||||
|
||||
const data_stats = {
|
||||
data: {
|
||||
user: {
|
||||
name: stats.name,
|
||||
repositoriesContributedTo: { totalCount: stats.contributedTo },
|
||||
contributionsCollection: {
|
||||
totalCommitContributions: stats.totalCommits,
|
||||
totalPullRequestReviewContributions: stats.totalReviews,
|
||||
},
|
||||
pullRequests: { totalCount: stats.totalPRs },
|
||||
mergedPullRequests: { totalCount: stats.totalPRsMerged },
|
||||
openIssues: { totalCount: stats.totalIssues },
|
||||
closedIssues: { totalCount: 0 },
|
||||
followers: { totalCount: 0 },
|
||||
repositoryDiscussions: { totalCount: stats.totalDiscussionsStarted },
|
||||
repositoryDiscussionComments: {
|
||||
totalCount: stats.totalDiscussionsAnswered,
|
||||
},
|
||||
repositories: {
|
||||
totalCount: 1,
|
||||
nodes: [{ stargazers: { totalCount: 100 } }],
|
||||
pageInfo: {
|
||||
hasNextPage: false,
|
||||
endCursor: "cursor",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
const faker = (query, data) => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
...query,
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, data);
|
||||
|
||||
return { req, res };
|
||||
};
|
||||
|
||||
benchmarkSuite("test /api", {
|
||||
["simple request"]: async () => {
|
||||
const { req, res } = faker({}, data_stats);
|
||||
|
||||
await api(req, res);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,17 @@
|
||||
import { benchmarkSuite } from "jest-bench";
|
||||
import { calculateRank } from "../../src/calculateRank.js";
|
||||
|
||||
benchmarkSuite("calculateRank", {
|
||||
["calculateRank"]: () => {
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 1300,
|
||||
prs: 1500,
|
||||
issues: 4500,
|
||||
reviews: 1000,
|
||||
repos: 0,
|
||||
stars: 600000,
|
||||
followers: 50000,
|
||||
});
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,51 @@
|
||||
import { benchmarkSuite } from "jest-bench";
|
||||
import gist from "../../api/gist.js";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { jest } from "@jest/globals";
|
||||
|
||||
const gist_data = {
|
||||
data: {
|
||||
viewer: {
|
||||
gist: {
|
||||
description:
|
||||
"List of countries and territories in English and Spanish: name, continent, capital, dial code, country codes, TLD, and area in sq km. Lista de países y territorios en Inglés y Español: nombre, continente, capital, código de teléfono, códigos de país, dominio y área en km cuadrados. Updated 2023",
|
||||
owner: {
|
||||
login: "Yizack",
|
||||
},
|
||||
stargazerCount: 33,
|
||||
forks: {
|
||||
totalCount: 11,
|
||||
},
|
||||
files: [
|
||||
{
|
||||
name: "countries.json",
|
||||
language: {
|
||||
name: "JSON",
|
||||
},
|
||||
size: 85858,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, gist_data);
|
||||
|
||||
benchmarkSuite("test /api/gist", {
|
||||
["simple request"]: async () => {
|
||||
const req = {
|
||||
query: {
|
||||
id: "bbfce31e0217a3689c8d961a356cb10d",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
await gist(req, res);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,50 @@
|
||||
import { benchmarkSuite } from "jest-bench";
|
||||
import pin from "../../api/pin.js";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { jest } from "@jest/globals";
|
||||
|
||||
const data_repo = {
|
||||
repository: {
|
||||
username: "anuraghazra",
|
||||
name: "convoychat",
|
||||
stargazers: {
|
||||
totalCount: 38000,
|
||||
},
|
||||
description: "Help us take over the world! React + TS + GraphQL Chat App",
|
||||
primaryLanguage: {
|
||||
color: "#2b7489",
|
||||
id: "MDg6TGFuZ3VhZ2UyODc=",
|
||||
name: "TypeScript",
|
||||
},
|
||||
forkCount: 100,
|
||||
isTemplate: false,
|
||||
},
|
||||
};
|
||||
|
||||
const data_user = {
|
||||
data: {
|
||||
user: { repository: data_repo.repository },
|
||||
organization: null,
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
benchmarkSuite("test /api/pin", {
|
||||
["simple request"]: async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
await pin(req, res);
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,110 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import { calculateRank } from "../src/calculateRank.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
describe("Test calculateRank", () => {
|
||||
it("new user gets C rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 0,
|
||||
prs: 0,
|
||||
issues: 0,
|
||||
reviews: 0,
|
||||
repos: 0,
|
||||
stars: 0,
|
||||
followers: 0,
|
||||
}),
|
||||
).toStrictEqual({ level: "C", percentile: 100 });
|
||||
});
|
||||
|
||||
it("beginner user gets B- rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 125,
|
||||
prs: 25,
|
||||
issues: 10,
|
||||
reviews: 5,
|
||||
repos: 0,
|
||||
stars: 25,
|
||||
followers: 5,
|
||||
}),
|
||||
).toStrictEqual({ level: "B-", percentile: 65.02918514848255 });
|
||||
});
|
||||
|
||||
it("median user gets B+ rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 250,
|
||||
prs: 50,
|
||||
issues: 25,
|
||||
reviews: 10,
|
||||
repos: 0,
|
||||
stars: 50,
|
||||
followers: 10,
|
||||
}),
|
||||
).toStrictEqual({ level: "B+", percentile: 46.09375 });
|
||||
});
|
||||
|
||||
it("average user gets B+ rank (include_all_commits)", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: true,
|
||||
commits: 1000,
|
||||
prs: 50,
|
||||
issues: 25,
|
||||
reviews: 10,
|
||||
repos: 0,
|
||||
stars: 50,
|
||||
followers: 10,
|
||||
}),
|
||||
).toStrictEqual({ level: "B+", percentile: 46.09375 });
|
||||
});
|
||||
|
||||
it("advanced user gets A rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 500,
|
||||
prs: 100,
|
||||
issues: 50,
|
||||
reviews: 20,
|
||||
repos: 0,
|
||||
stars: 200,
|
||||
followers: 40,
|
||||
}),
|
||||
).toStrictEqual({ level: "A", percentile: 20.841471354166664 });
|
||||
});
|
||||
|
||||
it("expert user gets A+ rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 1000,
|
||||
prs: 200,
|
||||
issues: 100,
|
||||
reviews: 40,
|
||||
repos: 0,
|
||||
stars: 800,
|
||||
followers: 160,
|
||||
}),
|
||||
).toStrictEqual({ level: "A+", percentile: 5.575988339442828 });
|
||||
});
|
||||
|
||||
it("sindresorhus gets S rank", () => {
|
||||
expect(
|
||||
calculateRank({
|
||||
all_commits: false,
|
||||
commits: 1300,
|
||||
prs: 1500,
|
||||
issues: 4500,
|
||||
reviews: 1000,
|
||||
repos: 0,
|
||||
stars: 600000,
|
||||
followers: 50000,
|
||||
}),
|
||||
).toStrictEqual({ level: "S", percentile: 0.4578556547153667 });
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,196 @@
|
||||
import { queryByTestId } from "@testing-library/dom";
|
||||
import "@testing-library/jest-dom";
|
||||
import { cssToObject } from "@uppercod/css-to-object";
|
||||
import { Card } from "../src/common/Card.js";
|
||||
import { icons } from "../src/common/icons.js";
|
||||
import { getCardColors } from "../src/common/utils.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
describe("Card", () => {
|
||||
it("should hide border", () => {
|
||||
const card = new Card({});
|
||||
card.setHideBorder(true);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"stroke-opacity",
|
||||
"0",
|
||||
);
|
||||
});
|
||||
|
||||
it("should not hide border", () => {
|
||||
const card = new Card({});
|
||||
card.setHideBorder(false);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"stroke-opacity",
|
||||
"1",
|
||||
);
|
||||
});
|
||||
|
||||
it("should have a custom title", () => {
|
||||
const card = new Card({
|
||||
customTitle: "custom title",
|
||||
defaultTitle: "default title",
|
||||
});
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-title")).toHaveTextContent(
|
||||
"custom title",
|
||||
);
|
||||
});
|
||||
|
||||
it("should set custom title", () => {
|
||||
const card = new Card({});
|
||||
card.setTitle("custom title");
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-title")).toHaveTextContent(
|
||||
"custom title",
|
||||
);
|
||||
});
|
||||
|
||||
it("should hide title", () => {
|
||||
const card = new Card({});
|
||||
card.setHideTitle(true);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-title")).toBeNull();
|
||||
});
|
||||
|
||||
it("should not hide title", () => {
|
||||
const card = new Card({});
|
||||
card.setHideTitle(false);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-title")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("title should have prefix icon", () => {
|
||||
const card = new Card({ title: "ok", titlePrefixIcon: icons.contribs });
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(document.getElementsByClassName("icon")[0]).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("title should not have prefix icon", () => {
|
||||
const card = new Card({ title: "ok" });
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(document.getElementsByClassName("icon")[0]).toBeUndefined();
|
||||
});
|
||||
|
||||
it("should have proper height, width", () => {
|
||||
const card = new Card({ height: 200, width: 200, title: "ok" });
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(document.getElementsByTagName("svg")[0]).toHaveAttribute(
|
||||
"height",
|
||||
"200",
|
||||
);
|
||||
expect(document.getElementsByTagName("svg")[0]).toHaveAttribute(
|
||||
"width",
|
||||
"200",
|
||||
);
|
||||
});
|
||||
|
||||
it("should have less height after title is hidden", () => {
|
||||
const card = new Card({ height: 200, title: "ok" });
|
||||
card.setHideTitle(true);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(document.getElementsByTagName("svg")[0]).toHaveAttribute(
|
||||
"height",
|
||||
"170",
|
||||
);
|
||||
});
|
||||
|
||||
it("main-card-body should have proper when title is visible", () => {
|
||||
const card = new Card({ height: 200 });
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "main-card-body")).toHaveAttribute(
|
||||
"transform",
|
||||
"translate(0, 55)",
|
||||
);
|
||||
});
|
||||
|
||||
it("main-card-body should have proper position after title is hidden", () => {
|
||||
const card = new Card({ height: 200 });
|
||||
card.setHideTitle(true);
|
||||
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "main-card-body")).toHaveAttribute(
|
||||
"transform",
|
||||
"translate(0, 25)",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with correct colors", () => {
|
||||
// returns theme based colors with proper overrides and defaults
|
||||
const { titleColor, textColor, iconColor, bgColor } = getCardColors({
|
||||
title_color: "f00",
|
||||
icon_color: "0f0",
|
||||
text_color: "00f",
|
||||
bg_color: "fff",
|
||||
theme: "default",
|
||||
});
|
||||
|
||||
const card = new Card({
|
||||
height: 200,
|
||||
colors: {
|
||||
titleColor,
|
||||
textColor,
|
||||
iconColor,
|
||||
bgColor,
|
||||
},
|
||||
});
|
||||
document.body.innerHTML = card.render(``);
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
|
||||
expect(headerClassStyles["fill"].trim()).toBe("#f00");
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#fff",
|
||||
);
|
||||
});
|
||||
it("should render gradient backgrounds", () => {
|
||||
const { titleColor, textColor, iconColor, bgColor } = getCardColors({
|
||||
title_color: "f00",
|
||||
icon_color: "0f0",
|
||||
text_color: "00f",
|
||||
bg_color: "90,fff,000,f00",
|
||||
theme: "default",
|
||||
});
|
||||
|
||||
const card = new Card({
|
||||
height: 200,
|
||||
colors: {
|
||||
titleColor,
|
||||
textColor,
|
||||
iconColor,
|
||||
bgColor,
|
||||
},
|
||||
});
|
||||
document.body.innerHTML = card.render(``);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"url(#gradient)",
|
||||
);
|
||||
expect(document.querySelector("defs #gradient")).toHaveAttribute(
|
||||
"gradientTransform",
|
||||
"rotate(90)",
|
||||
);
|
||||
expect(
|
||||
document.querySelector("defs #gradient stop:nth-child(1)"),
|
||||
).toHaveAttribute("stop-color", "#fff");
|
||||
expect(
|
||||
document.querySelector("defs #gradient stop:nth-child(2)"),
|
||||
).toHaveAttribute("stop-color", "#000");
|
||||
expect(
|
||||
document.querySelector("defs #gradient stop:nth-child(3)"),
|
||||
).toHaveAttribute("stop-color", "#f00");
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,225 @@
|
||||
/**
|
||||
* @file Contains end-to-end tests for the Vercel preview instance.
|
||||
*/
|
||||
import dotenv from "dotenv";
|
||||
dotenv.config();
|
||||
|
||||
import axios from "axios";
|
||||
import { renderRepoCard } from "../../src/cards/repo-card.js";
|
||||
import { renderStatsCard } from "../../src/cards/stats-card.js";
|
||||
import { renderTopLanguages } from "../../src/cards/top-languages-card.js";
|
||||
import { renderWakatimeCard } from "../../src/cards/wakatime-card.js";
|
||||
import { renderGistCard } from "../../src/cards/gist-card.js";
|
||||
import { expect, describe, beforeAll, test } from "@jest/globals";
|
||||
|
||||
const REPO = "curly-fiesta";
|
||||
const USER = "catelinemnemosyne";
|
||||
const STATS_CARD_USER = "e2eninja";
|
||||
const GIST_ID = "372cef55fd897b31909fdeb3a7262758";
|
||||
|
||||
const STATS_DATA = {
|
||||
name: "CodeNinja",
|
||||
totalPRs: 1,
|
||||
totalReviews: 0,
|
||||
totalCommits: 3,
|
||||
totalIssues: 1,
|
||||
totalStars: 1,
|
||||
contributedTo: 0,
|
||||
rank: {
|
||||
level: "C",
|
||||
percentile: 98.73972605284538,
|
||||
},
|
||||
};
|
||||
|
||||
const LANGS_DATA = {
|
||||
HTML: {
|
||||
color: "#e34c26",
|
||||
name: "HTML",
|
||||
size: 1721,
|
||||
},
|
||||
CSS: {
|
||||
color: "#563d7c",
|
||||
name: "CSS",
|
||||
size: 930,
|
||||
},
|
||||
JavaScript: {
|
||||
color: "#f1e05a",
|
||||
name: "JavaScript",
|
||||
size: 1912,
|
||||
},
|
||||
};
|
||||
|
||||
const WAKATIME_DATA = {
|
||||
human_readable_range: "last week",
|
||||
is_already_updating: false,
|
||||
is_coding_activity_visible: true,
|
||||
is_including_today: false,
|
||||
is_other_usage_visible: true,
|
||||
is_stuck: false,
|
||||
is_up_to_date: false,
|
||||
is_up_to_date_pending_future: false,
|
||||
percent_calculated: 0,
|
||||
range: "all_time",
|
||||
status: "pending_update",
|
||||
timeout: 15,
|
||||
username: USER,
|
||||
writes_only: false,
|
||||
};
|
||||
|
||||
const REPOSITORY_DATA = {
|
||||
name: REPO,
|
||||
nameWithOwner: `${USER}/cra-test`,
|
||||
isPrivate: false,
|
||||
isArchived: false,
|
||||
isTemplate: false,
|
||||
stargazers: {
|
||||
totalCount: 1,
|
||||
},
|
||||
description: "Simple cra test repo.",
|
||||
primaryLanguage: {
|
||||
color: "#f1e05a",
|
||||
id: "MDg6TGFuZ3VhZ2UxNDA=",
|
||||
name: "JavaScript",
|
||||
},
|
||||
forkCount: 0,
|
||||
starCount: 1,
|
||||
};
|
||||
|
||||
/**
|
||||
* @typedef {import("../../src/fetchers/types.js").GistData} GistData Gist data type.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @type {GistData}
|
||||
*/
|
||||
const GIST_DATA = {
|
||||
name: "link.txt",
|
||||
nameWithOwner: "qwerty541/link.txt",
|
||||
description:
|
||||
"Trying to access this path on Windown 10 ver. 1803+ will breaks NTFS",
|
||||
language: "Text",
|
||||
starsCount: 1,
|
||||
forksCount: 0,
|
||||
};
|
||||
|
||||
const CACHE_BURST_STRING = `v=${new Date().getTime()}`;
|
||||
|
||||
describe("Fetch Cards", () => {
|
||||
let VERCEL_PREVIEW_URL;
|
||||
|
||||
beforeAll(() => {
|
||||
process.env.NODE_ENV = "development";
|
||||
VERCEL_PREVIEW_URL = process.env.VERCEL_PREVIEW_URL;
|
||||
});
|
||||
|
||||
test("retrieve stats card", async () => {
|
||||
expect(VERCEL_PREVIEW_URL).toBeDefined();
|
||||
|
||||
// Check if the Vercel preview instance stats card function is up and running.
|
||||
await expect(
|
||||
axios.get(`${VERCEL_PREVIEW_URL}/api?username=${STATS_CARD_USER}`),
|
||||
).resolves.not.toThrow();
|
||||
|
||||
// Get local stats card.
|
||||
const localStatsCardSVG = renderStatsCard(STATS_DATA, {
|
||||
include_all_commits: true,
|
||||
});
|
||||
|
||||
// Get the Vercel preview stats card response.
|
||||
const serverStatsSvg = await axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api?username=${STATS_CARD_USER}&include_all_commits=true&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
|
||||
// Check if stats card from deployment matches the stats card from local.
|
||||
expect(serverStatsSvg.data).toEqual(localStatsCardSVG);
|
||||
}, 15000);
|
||||
|
||||
test("retrieve language card", async () => {
|
||||
expect(VERCEL_PREVIEW_URL).toBeDefined();
|
||||
|
||||
// Check if the Vercel preview instance language card function is up and running.
|
||||
console.log(
|
||||
`${VERCEL_PREVIEW_URL}/api/top-langs/?username=${USER}&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
await expect(
|
||||
axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/top-langs/?username=${USER}&${CACHE_BURST_STRING}`,
|
||||
),
|
||||
).resolves.not.toThrow();
|
||||
|
||||
// Get local language card.
|
||||
const localLanguageCardSVG = renderTopLanguages(LANGS_DATA);
|
||||
|
||||
// Get the Vercel preview language card response.
|
||||
const severLanguageSVG = await axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/top-langs/?username=${USER}&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
|
||||
// Check if language card from deployment matches the local language card.
|
||||
expect(severLanguageSVG.data).toEqual(localLanguageCardSVG);
|
||||
}, 15000);
|
||||
|
||||
test("retrieve WakaTime card", async () => {
|
||||
expect(VERCEL_PREVIEW_URL).toBeDefined();
|
||||
|
||||
// Check if the Vercel preview instance WakaTime function is up and running.
|
||||
await expect(
|
||||
axios.get(`${VERCEL_PREVIEW_URL}/api/wakatime?username=${USER}`),
|
||||
).resolves.not.toThrow();
|
||||
|
||||
// Get local WakaTime card.
|
||||
const localWakaCardSVG = renderWakatimeCard(WAKATIME_DATA);
|
||||
|
||||
// Get the Vercel preview WakaTime card response.
|
||||
const serverWakaTimeSvg = await axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/wakatime?username=${USER}&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
|
||||
// Check if WakaTime card from deployment matches the local WakaTime card.
|
||||
expect(serverWakaTimeSvg.data).toEqual(localWakaCardSVG);
|
||||
}, 15000);
|
||||
|
||||
test("retrieve repo card", async () => {
|
||||
expect(VERCEL_PREVIEW_URL).toBeDefined();
|
||||
|
||||
// Check if the Vercel preview instance Repo function is up and running.
|
||||
await expect(
|
||||
axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/pin/?username=${USER}&repo=${REPO}&${CACHE_BURST_STRING}`,
|
||||
),
|
||||
).resolves.not.toThrow();
|
||||
|
||||
// Get local repo card.
|
||||
const localRepoCardSVG = renderRepoCard(REPOSITORY_DATA);
|
||||
|
||||
// Get the Vercel preview repo card response.
|
||||
const serverRepoSvg = await axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/pin/?username=${USER}&repo=${REPO}&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
|
||||
// Check if Repo card from deployment matches the local Repo card.
|
||||
expect(serverRepoSvg.data).toEqual(localRepoCardSVG);
|
||||
}, 15000);
|
||||
|
||||
test("retrieve gist card", async () => {
|
||||
expect(VERCEL_PREVIEW_URL).toBeDefined();
|
||||
|
||||
// Check if the Vercel preview instance Gist function is up and running.
|
||||
await expect(
|
||||
axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/gist?id=${GIST_ID}&${CACHE_BURST_STRING}`,
|
||||
),
|
||||
).resolves.not.toThrow();
|
||||
|
||||
// Get local gist card.
|
||||
const localGistCardSVG = renderGistCard(GIST_DATA);
|
||||
|
||||
// Get the Vercel preview gist card response.
|
||||
const serverGistSvg = await axios.get(
|
||||
`${VERCEL_PREVIEW_URL}/api/gist?id=${GIST_ID}&${CACHE_BURST_STRING}`,
|
||||
);
|
||||
|
||||
// Check if Gist card from deployment matches the local Gist card.
|
||||
expect(serverGistSvg.data).toEqual(localGistCardSVG);
|
||||
}, 15000);
|
||||
});
|
||||
@@ -0,0 +1,117 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
import { fetchGist } from "../src/fetchers/gist-fetcher.js";
|
||||
|
||||
const gist_data = {
|
||||
data: {
|
||||
viewer: {
|
||||
gist: {
|
||||
description:
|
||||
"List of countries and territories in English and Spanish: name, continent, capital, dial code, country codes, TLD, and area in sq km. Lista de países y territorios en Inglés y Español: nombre, continente, capital, código de teléfono, códigos de país, dominio y área en km cuadrados. Updated 2023",
|
||||
owner: {
|
||||
login: "Yizack",
|
||||
},
|
||||
stargazerCount: 33,
|
||||
forks: {
|
||||
totalCount: 11,
|
||||
},
|
||||
files: [
|
||||
{
|
||||
name: "countries.json",
|
||||
language: {
|
||||
name: "JSON",
|
||||
},
|
||||
size: 85858,
|
||||
},
|
||||
{
|
||||
name: "territories.txt",
|
||||
language: {
|
||||
name: "Text",
|
||||
},
|
||||
size: 87858,
|
||||
},
|
||||
{
|
||||
name: "countries_spanish.json",
|
||||
language: {
|
||||
name: "JSON",
|
||||
},
|
||||
size: 85858,
|
||||
},
|
||||
{
|
||||
name: "territories_spanish.txt",
|
||||
language: {
|
||||
name: "Text",
|
||||
},
|
||||
size: 87858,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const gist_not_found_data = {
|
||||
data: {
|
||||
viewer: {
|
||||
gist: null,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const gist_errors_data = {
|
||||
errors: [
|
||||
{
|
||||
message: "Some test GraphQL error",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test fetchGist", () => {
|
||||
it("should fetch gist correctly", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, gist_data);
|
||||
|
||||
let gist = await fetchGist("bbfce31e0217a3689c8d961a356cb10d");
|
||||
|
||||
expect(gist).toStrictEqual({
|
||||
name: "countries.json",
|
||||
nameWithOwner: "Yizack/countries.json",
|
||||
description:
|
||||
"List of countries and territories in English and Spanish: name, continent, capital, dial code, country codes, TLD, and area in sq km. Lista de países y territorios en Inglés y Español: nombre, continente, capital, código de teléfono, códigos de país, dominio y área en km cuadrados. Updated 2023",
|
||||
language: "Text",
|
||||
starsCount: 33,
|
||||
forksCount: 11,
|
||||
});
|
||||
});
|
||||
|
||||
it("should throw correct error if gist not found", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, gist_not_found_data);
|
||||
|
||||
await expect(fetchGist("bbfce31e0217a3689c8d961a356cb10d")).rejects.toThrow(
|
||||
"Gist not found",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if reaponse contains them", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, gist_errors_data);
|
||||
|
||||
await expect(fetchGist("bbfce31e0217a3689c8d961a356cb10d")).rejects.toThrow(
|
||||
"Some test GraphQL error",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if id is not provided", async () => {
|
||||
await expect(fetchGist()).rejects.toThrow(
|
||||
'Missing params "id" make sure you pass the parameters in URL',
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,105 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { fetchRepo } from "../src/fetchers/repo-fetcher.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const data_repo = {
|
||||
repository: {
|
||||
name: "convoychat",
|
||||
stargazers: { totalCount: 38000 },
|
||||
description: "Help us take over the world! React + TS + GraphQL Chat App",
|
||||
primaryLanguage: {
|
||||
color: "#2b7489",
|
||||
id: "MDg6TGFuZ3VhZ2UyODc=",
|
||||
name: "TypeScript",
|
||||
},
|
||||
forkCount: 100,
|
||||
},
|
||||
};
|
||||
|
||||
const data_user = {
|
||||
data: {
|
||||
user: { repository: data_repo.repository },
|
||||
organization: null,
|
||||
},
|
||||
};
|
||||
|
||||
const data_org = {
|
||||
data: {
|
||||
user: null,
|
||||
organization: { repository: data_repo.repository },
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test fetchRepo", () => {
|
||||
it("should fetch correct user repo", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
let repo = await fetchRepo("anuraghazra", "convoychat");
|
||||
|
||||
expect(repo).toStrictEqual({
|
||||
...data_repo.repository,
|
||||
starCount: data_repo.repository.stargazers.totalCount,
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch correct org repo", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_org);
|
||||
|
||||
let repo = await fetchRepo("anuraghazra", "convoychat");
|
||||
expect(repo).toStrictEqual({
|
||||
...data_repo.repository,
|
||||
starCount: data_repo.repository.stargazers.totalCount,
|
||||
});
|
||||
});
|
||||
|
||||
it("should throw error if user is found but repo is null", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, { data: { user: { repository: null }, organization: null } });
|
||||
|
||||
await expect(fetchRepo("anuraghazra", "convoychat")).rejects.toThrow(
|
||||
"User Repository Not found",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if org is found but repo is null", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, { data: { user: null, organization: { repository: null } } });
|
||||
|
||||
await expect(fetchRepo("anuraghazra", "convoychat")).rejects.toThrow(
|
||||
"Organization Repository Not found",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if both user & org data not found", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, { data: { user: null, organization: null } });
|
||||
|
||||
await expect(fetchRepo("anuraghazra", "convoychat")).rejects.toThrow(
|
||||
"Not found",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if repository is private", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, {
|
||||
data: {
|
||||
user: { repository: { ...data_repo, isPrivate: true } },
|
||||
organization: null,
|
||||
},
|
||||
});
|
||||
|
||||
await expect(fetchRepo("anuraghazra", "convoychat")).rejects.toThrow(
|
||||
"User Repository Not found",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,463 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { calculateRank } from "../src/calculateRank.js";
|
||||
import { fetchStats } from "../src/fetchers/stats-fetcher.js";
|
||||
import { expect, it, describe, beforeEach, afterEach } from "@jest/globals";
|
||||
|
||||
// Test parameters.
|
||||
const data_stats = {
|
||||
data: {
|
||||
user: {
|
||||
name: "Anurag Hazra",
|
||||
repositoriesContributedTo: { totalCount: 61 },
|
||||
contributionsCollection: {
|
||||
totalCommitContributions: 100,
|
||||
totalPullRequestReviewContributions: 50,
|
||||
},
|
||||
pullRequests: { totalCount: 300 },
|
||||
mergedPullRequests: { totalCount: 240 },
|
||||
openIssues: { totalCount: 100 },
|
||||
closedIssues: { totalCount: 100 },
|
||||
followers: { totalCount: 100 },
|
||||
repositoryDiscussions: { totalCount: 10 },
|
||||
repositoryDiscussionComments: { totalCount: 40 },
|
||||
repositories: {
|
||||
totalCount: 5,
|
||||
nodes: [
|
||||
{ name: "test-repo-1", stargazers: { totalCount: 100 } },
|
||||
{ name: "test-repo-2", stargazers: { totalCount: 100 } },
|
||||
{ name: "test-repo-3", stargazers: { totalCount: 100 } },
|
||||
],
|
||||
pageInfo: {
|
||||
hasNextPage: true,
|
||||
endCursor: "cursor",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const data_repo = {
|
||||
data: {
|
||||
user: {
|
||||
repositories: {
|
||||
nodes: [
|
||||
{ name: "test-repo-4", stargazers: { totalCount: 50 } },
|
||||
{ name: "test-repo-5", stargazers: { totalCount: 50 } },
|
||||
],
|
||||
pageInfo: {
|
||||
hasNextPage: false,
|
||||
endCursor: "cursor",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const data_repo_zero_stars = {
|
||||
data: {
|
||||
user: {
|
||||
repositories: {
|
||||
nodes: [
|
||||
{ name: "test-repo-1", stargazers: { totalCount: 100 } },
|
||||
{ name: "test-repo-2", stargazers: { totalCount: 100 } },
|
||||
{ name: "test-repo-3", stargazers: { totalCount: 100 } },
|
||||
{ name: "test-repo-4", stargazers: { totalCount: 0 } },
|
||||
{ name: "test-repo-5", stargazers: { totalCount: 0 } },
|
||||
],
|
||||
pageInfo: {
|
||||
hasNextPage: true,
|
||||
endCursor: "cursor",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const error = {
|
||||
errors: [
|
||||
{
|
||||
type: "NOT_FOUND",
|
||||
path: ["user"],
|
||||
locations: [],
|
||||
message: "Could not resolve to a User with the login of 'noname'.",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
beforeEach(() => {
|
||||
process.env.FETCH_MULTI_PAGE_STARS = "false"; // Set to `false` to fetch only one page of stars.
|
||||
mock.onPost("https://api.github.com/graphql").reply((cfg) => {
|
||||
return [
|
||||
200,
|
||||
cfg.data.includes("contributionsCollection") ? data_stats : data_repo,
|
||||
];
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test fetchStats", () => {
|
||||
it("should fetch correct stats", async () => {
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should stop fetching when there are repos with zero stars", async () => {
|
||||
mock.reset();
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, data_stats)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, data_repo_zero_stars);
|
||||
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should throw error", async () => {
|
||||
mock.reset();
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, error);
|
||||
|
||||
await expect(fetchStats("anuraghazra")).rejects.toThrow(
|
||||
"Could not resolve to a User with the login of 'noname'.",
|
||||
);
|
||||
});
|
||||
|
||||
it("should fetch total commits", async () => {
|
||||
mock
|
||||
.onGet(
|
||||
"https://api.github.com/search/commits?per_page=1&q=author:anuraghazra",
|
||||
)
|
||||
.reply(200, { total_count: 1000 });
|
||||
|
||||
let stats = await fetchStats("anuraghazra", true);
|
||||
const rank = calculateRank({
|
||||
all_commits: true,
|
||||
commits: 1000,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 1000,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should throw specific error when include_all_commits true and invalid username", async () => {
|
||||
expect(fetchStats("asdf///---", true)).rejects.toThrow(
|
||||
new Error("Invalid username provided."),
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw specific error when include_all_commits true and API returns error", async () => {
|
||||
mock
|
||||
.onGet(
|
||||
"https://api.github.com/search/commits?per_page=1&q=author:anuraghazra",
|
||||
)
|
||||
.reply(200, { error: "Some test error message" });
|
||||
|
||||
expect(fetchStats("anuraghazra", true)).rejects.toThrow(
|
||||
new Error("Could not fetch data from GitHub REST API."),
|
||||
);
|
||||
});
|
||||
|
||||
it("should exclude stars of the `test-repo-1` repository", async () => {
|
||||
mock
|
||||
.onGet(
|
||||
"https://api.github.com/search/commits?per_page=1&q=author:anuraghazra",
|
||||
)
|
||||
.reply(200, { total_count: 1000 });
|
||||
|
||||
let stats = await fetchStats("anuraghazra", true, ["test-repo-1"]);
|
||||
const rank = calculateRank({
|
||||
all_commits: true,
|
||||
commits: 1000,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 200,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 1000,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 200,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch two pages of stars if 'FETCH_MULTI_PAGE_STARS' env variable is set to `true`", async () => {
|
||||
process.env.FETCH_MULTI_PAGE_STARS = true;
|
||||
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 400,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 400,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch one page of stars if 'FETCH_MULTI_PAGE_STARS' env variable is set to `false`", async () => {
|
||||
process.env.FETCH_MULTI_PAGE_STARS = "false";
|
||||
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch one page of stars if 'FETCH_MULTI_PAGE_STARS' env variable is not set", async () => {
|
||||
process.env.FETCH_MULTI_PAGE_STARS = undefined;
|
||||
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should not fetch additional stats data when it not requested", async () => {
|
||||
let stats = await fetchStats("anuraghazra");
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 0,
|
||||
mergedPRsPercentage: 0,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 0,
|
||||
totalDiscussionsAnswered: 0,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch additional stats when it requested", async () => {
|
||||
let stats = await fetchStats("anuraghazra", false, [], true, true, true);
|
||||
const rank = calculateRank({
|
||||
all_commits: false,
|
||||
commits: 100,
|
||||
prs: 300,
|
||||
reviews: 50,
|
||||
issues: 200,
|
||||
repos: 5,
|
||||
stars: 300,
|
||||
followers: 100,
|
||||
});
|
||||
|
||||
expect(stats).toStrictEqual({
|
||||
contributedTo: 61,
|
||||
name: "Anurag Hazra",
|
||||
totalCommits: 100,
|
||||
totalIssues: 200,
|
||||
totalPRs: 300,
|
||||
totalPRsMerged: 240,
|
||||
mergedPRsPercentage: 80,
|
||||
totalReviews: 50,
|
||||
totalStars: 300,
|
||||
totalDiscussionsStarted: 10,
|
||||
totalDiscussionsAnswered: 40,
|
||||
totalPRsAuthored: 0,
|
||||
totalPRsCommented: 0,
|
||||
totalPRsReviewed: 0,
|
||||
totalIssuesAuthored: 0,
|
||||
totalIssuesCommented: 0,
|
||||
rank,
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,171 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { fetchTopLanguages } from "../src/fetchers/top-languages-fetcher.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
const data_langs = {
|
||||
data: {
|
||||
user: {
|
||||
repositories: {
|
||||
nodes: [
|
||||
{
|
||||
name: "test-repo-1",
|
||||
languages: {
|
||||
edges: [{ size: 100, node: { color: "#0f0", name: "HTML" } }],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "test-repo-2",
|
||||
languages: {
|
||||
edges: [{ size: 100, node: { color: "#0f0", name: "HTML" } }],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "test-repo-3",
|
||||
languages: {
|
||||
edges: [
|
||||
{ size: 100, node: { color: "#0ff", name: "javascript" } },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "test-repo-4",
|
||||
languages: {
|
||||
edges: [
|
||||
{ size: 100, node: { color: "#0ff", name: "javascript" } },
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const error = {
|
||||
errors: [
|
||||
{
|
||||
type: "NOT_FOUND",
|
||||
path: ["user"],
|
||||
locations: [],
|
||||
message: "Could not resolve to a User with the login of 'noname'.",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
describe("FetchTopLanguages", () => {
|
||||
it("should fetch correct language data while using the new calculation", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
let repo = await fetchTopLanguages("anuraghazra", [], 0.5, 0.5);
|
||||
expect(repo).toStrictEqual({
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
count: 2,
|
||||
name: "HTML",
|
||||
size: 20.000000000000004,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
count: 2,
|
||||
name: "javascript",
|
||||
size: 20.000000000000004,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch correct language data while excluding the 'test-repo-1' repository", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
let repo = await fetchTopLanguages("anuraghazra", ["test-repo-1"]);
|
||||
expect(repo).toStrictEqual({
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
count: 1,
|
||||
name: "HTML",
|
||||
size: 100,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
count: 2,
|
||||
name: "javascript",
|
||||
size: 200,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("should fetch correct language data while using the old calculation", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
let repo = await fetchTopLanguages("anuraghazra", [], 1, 0);
|
||||
expect(repo).toStrictEqual({
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
count: 2,
|
||||
name: "HTML",
|
||||
size: 200,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
count: 2,
|
||||
name: "javascript",
|
||||
size: 200,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("should rank languages by the number of repositories they appear in", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
let repo = await fetchTopLanguages("anuraghazra", [], 0, 1);
|
||||
expect(repo).toStrictEqual({
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
count: 2,
|
||||
name: "HTML",
|
||||
size: 2,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
count: 2,
|
||||
name: "javascript",
|
||||
size: 2,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("should throw specific error when user not found", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, error);
|
||||
|
||||
await expect(fetchTopLanguages("anuraghazra")).rejects.toThrow(
|
||||
"Could not resolve to a User with the login of 'noname'.",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw other errors with their message", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, {
|
||||
errors: [{ message: "Some test GraphQL error" }],
|
||||
});
|
||||
|
||||
await expect(fetchTopLanguages("anuraghazra")).rejects.toThrow(
|
||||
"Some test GraphQL error",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error with specific message when error does not contain message property", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, {
|
||||
errors: [{ type: "TEST" }],
|
||||
});
|
||||
|
||||
await expect(fetchTopLanguages("anuraghazra")).rejects.toThrow(
|
||||
"Something went wrong while trying to retrieve the language data using the GraphQL API.",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,135 @@
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { fetchWakatimeStats } from "../src/fetchers/wakatime-fetcher.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
const wakaTimeData = {
|
||||
data: {
|
||||
categories: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "Coding",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
daily_average: 16095,
|
||||
daily_average_including_other_language: 16329,
|
||||
days_including_holidays: 7,
|
||||
days_minus_holidays: 5,
|
||||
editors: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "VS Code",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
holidays: 2,
|
||||
human_readable_daily_average: "4 hrs 28 mins",
|
||||
human_readable_daily_average_including_other_language: "4 hrs 32 mins",
|
||||
human_readable_total: "22 hrs 21 mins",
|
||||
human_readable_total_including_other_language: "22 hrs 40 mins",
|
||||
id: "random hash",
|
||||
is_already_updating: false,
|
||||
is_coding_activity_visible: true,
|
||||
is_including_today: false,
|
||||
is_other_usage_visible: true,
|
||||
is_stuck: false,
|
||||
is_up_to_date: true,
|
||||
languages: [
|
||||
{
|
||||
digital: "0:19",
|
||||
hours: 0,
|
||||
minutes: 19,
|
||||
name: "Other",
|
||||
percent: 1.43,
|
||||
text: "19 mins",
|
||||
total_seconds: 1170.434361,
|
||||
},
|
||||
{
|
||||
digital: "0:01",
|
||||
hours: 0,
|
||||
minutes: 1,
|
||||
name: "TypeScript",
|
||||
percent: 0.1,
|
||||
text: "1 min",
|
||||
total_seconds: 83.293809,
|
||||
},
|
||||
{
|
||||
digital: "0:00",
|
||||
hours: 0,
|
||||
minutes: 0,
|
||||
name: "YAML",
|
||||
percent: 0.07,
|
||||
text: "0 secs",
|
||||
total_seconds: 54.975151,
|
||||
},
|
||||
],
|
||||
operating_systems: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "Mac",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
percent_calculated: 100,
|
||||
range: "last_7_days",
|
||||
status: "ok",
|
||||
timeout: 15,
|
||||
total_seconds: 80473.135716,
|
||||
total_seconds_including_other_language: 81643.570077,
|
||||
user_id: "random hash",
|
||||
username: "anuraghazra",
|
||||
writes_only: false,
|
||||
},
|
||||
};
|
||||
|
||||
describe("WakaTime fetcher", () => {
|
||||
it("should fetch correct WakaTime data", async () => {
|
||||
const username = "anuraghazra";
|
||||
mock
|
||||
.onGet(
|
||||
`https://wakatime.com/api/v1/users/${username}/stats?is_including_today=true`,
|
||||
)
|
||||
.reply(200, wakaTimeData);
|
||||
|
||||
const repo = await fetchWakatimeStats({ username });
|
||||
expect(repo).toStrictEqual(wakaTimeData.data);
|
||||
});
|
||||
|
||||
it("should throw error if username param missing", async () => {
|
||||
mock.onGet(/\/https:\/\/wakatime\.com\/api/).reply(404, wakaTimeData);
|
||||
|
||||
await expect(fetchWakatimeStats("noone")).rejects.toThrow(
|
||||
'Missing params "username" make sure you pass the parameters in URL',
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if username is not found", async () => {
|
||||
mock.onGet(/\/https:\/\/wakatime\.com\/api/).reply(404, wakaTimeData);
|
||||
|
||||
await expect(fetchWakatimeStats({ username: "noone" })).rejects.toThrow(
|
||||
"Could not resolve to a User with the login of 'noone'",
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
export { wakaTimeData };
|
||||
@@ -0,0 +1,47 @@
|
||||
import { flexLayout } from "../src/common/utils.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
describe("flexLayout", () => {
|
||||
it("should work with row & col layouts", () => {
|
||||
const layout = flexLayout({
|
||||
items: ["<text>1</text>", "<text>2</text>"],
|
||||
gap: 60,
|
||||
});
|
||||
|
||||
expect(layout).toStrictEqual([
|
||||
`<g transform="translate(0, 0)"><text>1</text></g>`,
|
||||
`<g transform="translate(60, 0)"><text>2</text></g>`,
|
||||
]);
|
||||
|
||||
const columns = flexLayout({
|
||||
items: ["<text>1</text>", "<text>2</text>"],
|
||||
gap: 60,
|
||||
direction: "column",
|
||||
});
|
||||
|
||||
expect(columns).toStrictEqual([
|
||||
`<g transform="translate(0, 0)"><text>1</text></g>`,
|
||||
`<g transform="translate(0, 60)"><text>2</text></g>`,
|
||||
]);
|
||||
});
|
||||
|
||||
it("should work with sizes", () => {
|
||||
const layout = flexLayout({
|
||||
items: [
|
||||
"<text>1</text>",
|
||||
"<text>2</text>",
|
||||
"<text>3</text>",
|
||||
"<text>4</text>",
|
||||
],
|
||||
gap: 20,
|
||||
sizes: [200, 100, 55, 25],
|
||||
});
|
||||
|
||||
expect(layout).toStrictEqual([
|
||||
`<g transform="translate(0, 0)"><text>1</text></g>`,
|
||||
`<g transform="translate(220, 0)"><text>2</text></g>`,
|
||||
`<g transform="translate(340, 0)"><text>3</text></g>`,
|
||||
`<g transform="translate(415, 0)"><text>4</text></g>`,
|
||||
]);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,173 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
import { renderGistCard } from "../src/cards/gist-card.js";
|
||||
import { renderError } from "../src/common/utils.js";
|
||||
import gist from "../api/gist.js";
|
||||
|
||||
const gist_data = {
|
||||
data: {
|
||||
viewer: {
|
||||
gist: {
|
||||
description:
|
||||
"List of countries and territories in English and Spanish: name, continent, capital, dial code, country codes, TLD, and area in sq km. Lista de países y territorios en Inglés y Español: nombre, continente, capital, código de teléfono, códigos de país, dominio y área en km cuadrados. Updated 2023",
|
||||
owner: {
|
||||
login: "Yizack",
|
||||
},
|
||||
stargazerCount: 33,
|
||||
forks: {
|
||||
totalCount: 11,
|
||||
},
|
||||
files: [
|
||||
{
|
||||
name: "countries.json",
|
||||
language: {
|
||||
name: "JSON",
|
||||
},
|
||||
size: 85858,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const gist_not_found_data = {
|
||||
data: {
|
||||
viewer: {
|
||||
gist: null,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/gist", () => {
|
||||
it("should test the request", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
id: "bbfce31e0217a3689c8d961a356cb10d",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, gist_data);
|
||||
|
||||
await gist(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderGistCard({
|
||||
name: gist_data.data.viewer.gist.files[0].name,
|
||||
nameWithOwner: `${gist_data.data.viewer.gist.owner.login}/${gist_data.data.viewer.gist.files[0].name}`,
|
||||
description: gist_data.data.viewer.gist.description,
|
||||
language: gist_data.data.viewer.gist.files[0].language.name,
|
||||
starsCount: gist_data.data.viewer.gist.stargazerCount,
|
||||
forksCount: gist_data.data.viewer.gist.forks.totalCount,
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
it("should get the query options", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
id: "bbfce31e0217a3689c8d961a356cb10d",
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
show_owner: true,
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, gist_data);
|
||||
|
||||
await gist(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderGistCard(
|
||||
{
|
||||
name: gist_data.data.viewer.gist.files[0].name,
|
||||
nameWithOwner: `${gist_data.data.viewer.gist.owner.login}/${gist_data.data.viewer.gist.files[0].name}`,
|
||||
description: gist_data.data.viewer.gist.description,
|
||||
language: gist_data.data.viewer.gist.files[0].language.name,
|
||||
starsCount: gist_data.data.viewer.gist.stargazerCount,
|
||||
forksCount: gist_data.data.viewer.gist.forks.totalCount,
|
||||
},
|
||||
{ ...req.query },
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error if id is not provided", async () => {
|
||||
const req = {
|
||||
query: {},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
await gist(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
'Missing params "id" make sure you pass the parameters in URL',
|
||||
"/api/gist?id=GIST_ID",
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error if gist is not found", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
id: "bbfce31e0217a3689c8d961a356cb10d",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, gist_not_found_data);
|
||||
|
||||
await gist(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(renderError("Gist not found"));
|
||||
});
|
||||
|
||||
it("should render error if wrong locale is provided", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
id: "bbfce31e0217a3689c8d961a356cb10d",
|
||||
locale: "asdf",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
await gist(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "Language not found"),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,33 @@
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
import { I18n } from "../src/common/I18n.js";
|
||||
import { statCardLocales } from "../src/translations.js";
|
||||
|
||||
describe("I18n", () => {
|
||||
it("should return translated string", () => {
|
||||
const i18n = new I18n({
|
||||
locale: "en",
|
||||
translations: statCardLocales({ name: "Anurag Hazra", apostrophe: "s" }),
|
||||
});
|
||||
expect(i18n.t("statcard.title")).toBe("Anurag Hazra's GitHub Stats");
|
||||
});
|
||||
|
||||
it("should throw error if translation string not found", () => {
|
||||
const i18n = new I18n({
|
||||
locale: "en",
|
||||
translations: statCardLocales({ name: "Anurag Hazra", apostrophe: "s" }),
|
||||
});
|
||||
expect(() => i18n.t("statcard.title1")).toThrow(
|
||||
"statcard.title1 Translation string not found",
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw error if translation not found for locale", () => {
|
||||
const i18n = new I18n({
|
||||
locale: "asdf",
|
||||
translations: statCardLocales({ name: "Anurag Hazra", apostrophe: "s" }),
|
||||
});
|
||||
expect(() => i18n.t("statcard.title")).toThrow(
|
||||
"'statcard.title' translation not found for locale 'asdf'",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,245 @@
|
||||
/**
|
||||
* @file Tests for the status/pat-info cloud function.
|
||||
*/
|
||||
import dotenv from "dotenv";
|
||||
dotenv.config();
|
||||
|
||||
import { jest } from "@jest/globals";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import patInfo, { RATE_LIMIT_SECONDS } from "../api/status/pat-info.js";
|
||||
import { expect, it, describe, afterEach, beforeAll } from "@jest/globals";
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
const successData = {
|
||||
data: {
|
||||
rateLimit: {
|
||||
remaining: 4986,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const faker = (query) => {
|
||||
const req = {
|
||||
query: { ...query },
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
return { req, res };
|
||||
};
|
||||
|
||||
const rate_limit_error = {
|
||||
errors: [
|
||||
{
|
||||
type: "RATE_LIMITED",
|
||||
message: "API rate limit exceeded for user ID.",
|
||||
},
|
||||
],
|
||||
data: {
|
||||
rateLimit: {
|
||||
resetAt: Date.now(),
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const other_error = {
|
||||
errors: [
|
||||
{
|
||||
type: "SOME_ERROR",
|
||||
message: "This is a error",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const bad_credentials_error = {
|
||||
message: "Bad credentials",
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/status/pat-info", () => {
|
||||
beforeAll(() => {
|
||||
// reset patenv first so that dotenv doesn't populate them with local envs
|
||||
process.env = {};
|
||||
process.env.PAT_1 = "testPAT1";
|
||||
process.env.PAT_2 = "testPAT2";
|
||||
process.env.PAT_3 = "testPAT3";
|
||||
process.env.PAT_4 = "testPAT4";
|
||||
});
|
||||
|
||||
it("should return only 'validPATs' if all PATs are valid", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, rate_limit_error)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(
|
||||
JSON.stringify(
|
||||
{
|
||||
validPATs: ["PAT_2", "PAT_3", "PAT_4"],
|
||||
expiredPATs: [],
|
||||
exhaustedPATs: ["PAT_1"],
|
||||
suspendedPATs: [],
|
||||
errorPATs: [],
|
||||
details: {
|
||||
PAT_1: {
|
||||
status: "exhausted",
|
||||
remaining: 0,
|
||||
resetIn: "0 minutes",
|
||||
},
|
||||
PAT_2: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_3: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_4: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
},
|
||||
},
|
||||
null,
|
||||
2,
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should return `errorPATs` if a PAT causes an error to be thrown", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, other_error)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(
|
||||
JSON.stringify(
|
||||
{
|
||||
validPATs: ["PAT_2", "PAT_3", "PAT_4"],
|
||||
expiredPATs: [],
|
||||
exhaustedPATs: [],
|
||||
suspendedPATs: [],
|
||||
errorPATs: ["PAT_1"],
|
||||
details: {
|
||||
PAT_1: {
|
||||
status: "error",
|
||||
error: {
|
||||
type: "SOME_ERROR",
|
||||
message: "This is a error",
|
||||
},
|
||||
},
|
||||
PAT_2: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_3: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_4: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
},
|
||||
},
|
||||
null,
|
||||
2,
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should return `expiredPaths` if a PAT returns a 'Bad credentials' error", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(404, bad_credentials_error)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(
|
||||
JSON.stringify(
|
||||
{
|
||||
validPATs: ["PAT_2", "PAT_3", "PAT_4"],
|
||||
expiredPATs: ["PAT_1"],
|
||||
exhaustedPATs: [],
|
||||
suspendedPATs: [],
|
||||
errorPATs: [],
|
||||
details: {
|
||||
PAT_1: {
|
||||
status: "expired",
|
||||
},
|
||||
PAT_2: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_3: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
PAT_4: {
|
||||
status: "valid",
|
||||
remaining: 4986,
|
||||
},
|
||||
},
|
||||
},
|
||||
null,
|
||||
2,
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should throw an error if something goes wrong", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").networkError();
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith("Something went wrong: Network Error");
|
||||
});
|
||||
|
||||
it("should have proper cache when no error is thrown", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader.mock.calls).toEqual([
|
||||
["Content-Type", "application/json"],
|
||||
["Cache-Control", `max-age=0, s-maxage=${RATE_LIMIT_SECONDS}`],
|
||||
]);
|
||||
});
|
||||
|
||||
it("should have proper cache when error is thrown", async () => {
|
||||
mock.reset();
|
||||
mock.onPost("https://api.github.com/graphql").networkError();
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await patInfo(req, res);
|
||||
|
||||
expect(res.setHeader.mock.calls).toEqual([
|
||||
["Content-Type", "application/json"],
|
||||
["Cache-Control", "no-store"],
|
||||
]);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,204 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import pin from "../api/pin.js";
|
||||
import { renderRepoCard } from "../src/cards/repo-card.js";
|
||||
import { renderError } from "../src/common/utils.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const data_repo = {
|
||||
repository: {
|
||||
username: "anuraghazra",
|
||||
name: "convoychat",
|
||||
stargazers: {
|
||||
totalCount: 38000,
|
||||
},
|
||||
description: "Help us take over the world! React + TS + GraphQL Chat App",
|
||||
primaryLanguage: {
|
||||
color: "#2b7489",
|
||||
id: "MDg6TGFuZ3VhZ2UyODc=",
|
||||
name: "TypeScript",
|
||||
},
|
||||
forkCount: 100,
|
||||
isTemplate: false,
|
||||
},
|
||||
};
|
||||
|
||||
const data_user = {
|
||||
data: {
|
||||
user: { repository: data_repo.repository },
|
||||
organization: null,
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/pin", () => {
|
||||
it("should test the request", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderRepoCard({
|
||||
...data_repo.repository,
|
||||
starCount: data_repo.repository.stargazers.totalCount,
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
it("should get the query options", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
full_name: "1",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderRepoCard(
|
||||
{
|
||||
...data_repo.repository,
|
||||
starCount: data_repo.repository.stargazers.totalCount,
|
||||
},
|
||||
{ ...req.query },
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if user repo not found", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, { data: { user: { repository: null }, organization: null } });
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(renderError("User Repository Not found"));
|
||||
});
|
||||
|
||||
it("should render error card if org repo not found", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(200, { data: { user: null, organization: { repository: null } } });
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Organization Repository Not found"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if username in blacklist", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "renovate-bot",
|
||||
repo: "convoychat",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "This username is blacklisted"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if wrong locale provided", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
repo: "convoychat",
|
||||
locale: "asdf",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_user);
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "Language not found"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if missing required parameters", async () => {
|
||||
const req = {
|
||||
query: {},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
await pin(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
'Missing params "username", "repo" make sure you pass the parameters in URL',
|
||||
"/api/pin?username=USERNAME&repo=REPO_NAME",
|
||||
),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,239 @@
|
||||
import { renderGistCard } from "../src/cards/gist-card.js";
|
||||
import { describe, expect, it } from "@jest/globals";
|
||||
import { queryByTestId } from "@testing-library/dom";
|
||||
import { cssToObject } from "@uppercod/css-to-object";
|
||||
import { themes } from "../themes/index.js";
|
||||
import "@testing-library/jest-dom";
|
||||
|
||||
/**
|
||||
* @type {import("../src/fetchers/gist-fetcher.js").GistData}
|
||||
*/
|
||||
const data = {
|
||||
name: "test",
|
||||
nameWithOwner: "anuraghazra/test",
|
||||
description: "Small test repository with different Python programs.",
|
||||
language: "Python",
|
||||
starsCount: 163,
|
||||
forksCount: 19,
|
||||
};
|
||||
|
||||
describe("test renderGistCard", () => {
|
||||
it("should render correctly", () => {
|
||||
document.body.innerHTML = renderGistCard(data);
|
||||
|
||||
const [header] = document.getElementsByClassName("header");
|
||||
|
||||
expect(header).toHaveTextContent("test");
|
||||
expect(header).not.toHaveTextContent("anuraghazra");
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"Small test repository with different Python programs.",
|
||||
);
|
||||
expect(queryByTestId(document.body, "starsCount")).toHaveTextContent("163");
|
||||
expect(queryByTestId(document.body, "forksCount")).toHaveTextContent("19");
|
||||
expect(queryByTestId(document.body, "lang-name")).toHaveTextContent(
|
||||
"Python",
|
||||
);
|
||||
expect(queryByTestId(document.body, "lang-color")).toHaveAttribute(
|
||||
"fill",
|
||||
"#3572A5",
|
||||
);
|
||||
});
|
||||
|
||||
it("should display username in title if show_owner is true", () => {
|
||||
document.body.innerHTML = renderGistCard(data, { show_owner: true });
|
||||
const [header] = document.getElementsByClassName("header");
|
||||
expect(header).toHaveTextContent("anuraghazra/test");
|
||||
});
|
||||
|
||||
it("should trim header if name is too long", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
name: "some-really-long-repo-name-for-test-purposes",
|
||||
});
|
||||
const [header] = document.getElementsByClassName("header");
|
||||
expect(header).toHaveTextContent("some-really-long-repo-name-for-test...");
|
||||
});
|
||||
|
||||
it("should trim description if description os too long", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
description:
|
||||
"The quick brown fox jumps over the lazy dog is an English-language pangram—a sentence that contains all of the letters of the English alphabet",
|
||||
});
|
||||
expect(
|
||||
document.getElementsByClassName("description")[0].children[0].textContent,
|
||||
).toBe("The quick brown fox jumps over the lazy dog is an");
|
||||
|
||||
expect(
|
||||
document.getElementsByClassName("description")[0].children[1].textContent,
|
||||
).toBe("English-language pangram—a sentence that contains all");
|
||||
});
|
||||
|
||||
it("should not trim description if it is short", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
description: "Small text should not trim",
|
||||
});
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"Small text should not trim",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render emojis in description", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
description: "This is a test gist description with :heart: emoji.",
|
||||
});
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"This is a test gist description with ❤️ emoji.",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors properly", () => {
|
||||
const customColors = {
|
||||
title_color: "5a0",
|
||||
icon_color: "1b998b",
|
||||
text_color: "9991",
|
||||
bg_color: "252525",
|
||||
};
|
||||
|
||||
document.body.innerHTML = renderGistCard(data, {
|
||||
...customColors,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(`#${customColors.title_color}`);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${customColors.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${customColors.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#252525",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with all the themes", () => {
|
||||
Object.keys(themes).forEach((name) => {
|
||||
document.body.innerHTML = renderGistCard(data, {
|
||||
theme: name,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes[name].title_color}`,
|
||||
);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes[name].text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes[name].icon_color}`);
|
||||
const backgroundElement = queryByTestId(document.body, "card-bg");
|
||||
const backgroundElementFill = backgroundElement.getAttribute("fill");
|
||||
expect([`#${themes[name].bg_color}`, "url(#gradient)"]).toContain(
|
||||
backgroundElementFill,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it("should render custom colors with themes", () => {
|
||||
document.body.innerHTML = renderGistCard(data, {
|
||||
title_color: "5a0",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe("#5a0");
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes.radical.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors with themes and fallback to default colors if invalid", () => {
|
||||
document.body.innerHTML = renderGistCard(data, {
|
||||
title_color: "invalid color",
|
||||
text_color: "invalid color",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes.default.title_color}`,
|
||||
);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes.default.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should not render star count or fork count if either of the are zero", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
starsCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "starsCount")).toBeNull();
|
||||
expect(queryByTestId(document.body, "forksCount")).toBeInTheDocument();
|
||||
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
starsCount: 1,
|
||||
forksCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "starsCount")).toBeInTheDocument();
|
||||
expect(queryByTestId(document.body, "forksCount")).toBeNull();
|
||||
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
starsCount: 0,
|
||||
forksCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "starsCount")).toBeNull();
|
||||
expect(queryByTestId(document.body, "forksCount")).toBeNull();
|
||||
});
|
||||
|
||||
it("should render without rounding", () => {
|
||||
document.body.innerHTML = renderGistCard(data, {
|
||||
border_radius: "0",
|
||||
});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "0");
|
||||
document.body.innerHTML = renderGistCard(data, {});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
|
||||
});
|
||||
|
||||
it("should fallback to default description", () => {
|
||||
document.body.innerHTML = renderGistCard({
|
||||
...data,
|
||||
description: undefined,
|
||||
});
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"No description provided",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,372 @@
|
||||
import { queryByTestId } from "@testing-library/dom";
|
||||
import "@testing-library/jest-dom";
|
||||
import { cssToObject } from "@uppercod/css-to-object";
|
||||
import { renderRepoCard } from "../src/cards/repo-card.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
import { themes } from "../themes/index.js";
|
||||
|
||||
const data_repo = {
|
||||
repository: {
|
||||
nameWithOwner: "anuraghazra/convoychat",
|
||||
name: "convoychat",
|
||||
description: "Help us take over the world! React + TS + GraphQL Chat App",
|
||||
primaryLanguage: {
|
||||
color: "#2b7489",
|
||||
id: "MDg6TGFuZ3VhZ2UyODc=",
|
||||
name: "TypeScript",
|
||||
},
|
||||
starCount: 38000,
|
||||
forkCount: 100,
|
||||
},
|
||||
};
|
||||
|
||||
describe("Test renderRepoCard", () => {
|
||||
it("should render correctly", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository);
|
||||
|
||||
const [header] = document.getElementsByClassName("header");
|
||||
|
||||
expect(header).toHaveTextContent("convoychat");
|
||||
expect(header).not.toHaveTextContent("anuraghazra");
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"Help us take over the world! React + TS + GraphQL Chat App",
|
||||
);
|
||||
expect(queryByTestId(document.body, "stargazers")).toHaveTextContent("38k");
|
||||
expect(queryByTestId(document.body, "forkcount")).toHaveTextContent("100");
|
||||
expect(queryByTestId(document.body, "lang-name")).toHaveTextContent(
|
||||
"TypeScript",
|
||||
);
|
||||
expect(queryByTestId(document.body, "lang-color")).toHaveAttribute(
|
||||
"fill",
|
||||
"#2b7489",
|
||||
);
|
||||
});
|
||||
|
||||
it("should display username in title (full repo name)", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
show_owner: true,
|
||||
});
|
||||
expect(document.getElementsByClassName("header")[0]).toHaveTextContent(
|
||||
"anuraghazra/convoychat",
|
||||
);
|
||||
});
|
||||
|
||||
it("should trim header", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
name: "some-really-long-repo-name-for-test-purposes",
|
||||
});
|
||||
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"some-really-long-repo-name-for-test...",
|
||||
);
|
||||
});
|
||||
|
||||
it("should trim description", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
description:
|
||||
"The quick brown fox jumps over the lazy dog is an English-language pangram—a sentence that contains all of the letters of the English alphabet",
|
||||
});
|
||||
|
||||
expect(
|
||||
document.getElementsByClassName("description")[0].children[0].textContent,
|
||||
).toBe("The quick brown fox jumps over the lazy dog is an");
|
||||
|
||||
expect(
|
||||
document.getElementsByClassName("description")[0].children[1].textContent,
|
||||
).toBe("English-language pangram—a sentence that contains all");
|
||||
|
||||
// Should not trim
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
description: "Small text should not trim",
|
||||
});
|
||||
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"Small text should not trim",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render emojis", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
description: "This is a text with a :poop: poo emoji",
|
||||
});
|
||||
|
||||
// poop emoji may not show in all editors but it's there between "a" and "poo"
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"This is a text with a 💩 poo emoji",
|
||||
);
|
||||
});
|
||||
|
||||
it("should hide language if primaryLanguage is null & fallback to correct values", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
primaryLanguage: null,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "primary-lang")).toBeNull();
|
||||
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
primaryLanguage: { color: null, name: null },
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "primary-lang")).toBeInTheDocument();
|
||||
expect(queryByTestId(document.body, "lang-color")).toHaveAttribute(
|
||||
"fill",
|
||||
"#333",
|
||||
);
|
||||
|
||||
expect(queryByTestId(document.body, "lang-name")).toHaveTextContent(
|
||||
"Unspecified",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render default colors properly", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository);
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe("#2f80ed");
|
||||
expect(descClassStyles.fill.trim()).toBe("#434d58");
|
||||
expect(iconClassStyles.fill.trim()).toBe("#586069");
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#fffefe",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors properly", () => {
|
||||
const customColors = {
|
||||
title_color: "5a0",
|
||||
icon_color: "1b998b",
|
||||
text_color: "9991",
|
||||
bg_color: "252525",
|
||||
};
|
||||
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
...customColors,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(`#${customColors.title_color}`);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${customColors.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${customColors.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#252525",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with all the themes", () => {
|
||||
Object.keys(themes).forEach((name) => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
theme: name,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes[name].title_color}`,
|
||||
);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes[name].text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes[name].icon_color}`);
|
||||
const backgroundElement = queryByTestId(document.body, "card-bg");
|
||||
const backgroundElementFill = backgroundElement.getAttribute("fill");
|
||||
expect([`#${themes[name].bg_color}`, "url(#gradient)"]).toContain(
|
||||
backgroundElementFill,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it("should render custom colors with themes", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
title_color: "5a0",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe("#5a0");
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes.radical.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors with themes and fallback to default colors if invalid", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
title_color: "invalid color",
|
||||
text_color: "invalid color",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes.default.title_color}`,
|
||||
);
|
||||
expect(descClassStyles.fill.trim()).toBe(`#${themes.default.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should not render star count or fork count if either of the are zero", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
starCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "stargazers")).toBeNull();
|
||||
expect(queryByTestId(document.body, "forkcount")).toBeInTheDocument();
|
||||
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
starCount: 1,
|
||||
forkCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "stargazers")).toBeInTheDocument();
|
||||
expect(queryByTestId(document.body, "forkcount")).toBeNull();
|
||||
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
starCount: 0,
|
||||
forkCount: 0,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "stargazers")).toBeNull();
|
||||
expect(queryByTestId(document.body, "forkcount")).toBeNull();
|
||||
});
|
||||
|
||||
it("should render badges", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
isArchived: true,
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "badge")).toHaveTextContent("Archived");
|
||||
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
isTemplate: true,
|
||||
});
|
||||
expect(queryByTestId(document.body, "badge")).toHaveTextContent("Template");
|
||||
});
|
||||
|
||||
it("should not render template", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
});
|
||||
expect(queryByTestId(document.body, "badge")).toBeNull();
|
||||
});
|
||||
|
||||
it("should render translated badges", () => {
|
||||
document.body.innerHTML = renderRepoCard(
|
||||
{
|
||||
...data_repo.repository,
|
||||
isArchived: true,
|
||||
},
|
||||
{
|
||||
locale: "cn",
|
||||
},
|
||||
);
|
||||
|
||||
expect(queryByTestId(document.body, "badge")).toHaveTextContent("已归档");
|
||||
|
||||
document.body.innerHTML = renderRepoCard(
|
||||
{
|
||||
...data_repo.repository,
|
||||
isTemplate: true,
|
||||
},
|
||||
{
|
||||
locale: "cn",
|
||||
},
|
||||
);
|
||||
expect(queryByTestId(document.body, "badge")).toHaveTextContent("模板");
|
||||
});
|
||||
|
||||
it("should render without rounding", () => {
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
border_radius: "0",
|
||||
});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "0");
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
|
||||
});
|
||||
|
||||
it("should fallback to default description", () => {
|
||||
document.body.innerHTML = renderRepoCard({
|
||||
...data_repo.repository,
|
||||
description: undefined,
|
||||
isArchived: true,
|
||||
});
|
||||
expect(document.getElementsByClassName("description")[0]).toHaveTextContent(
|
||||
"No description provided",
|
||||
);
|
||||
});
|
||||
|
||||
it("should have correct height with specified `description_lines_count` parameter", () => {
|
||||
// Testing short description
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
description_lines_count: 1,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "120");
|
||||
document.body.innerHTML = renderRepoCard(data_repo.repository, {
|
||||
description_lines_count: 3,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "150");
|
||||
|
||||
// Testing long description
|
||||
const longDescription =
|
||||
"A tool that will make a lot of iPhone/iPad developers' life easier. It shares your app over-the-air in a WiFi network. Bonjour is used and no configuration is needed.";
|
||||
document.body.innerHTML = renderRepoCard(
|
||||
{ ...data_repo.repository, description: longDescription },
|
||||
{
|
||||
description_lines_count: 3,
|
||||
},
|
||||
);
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "150");
|
||||
document.body.innerHTML = renderRepoCard(
|
||||
{ ...data_repo.repository, description: longDescription },
|
||||
{
|
||||
description_lines_count: 1,
|
||||
},
|
||||
);
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "120");
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,464 @@
|
||||
import {
|
||||
getByTestId,
|
||||
queryAllByTestId,
|
||||
queryByTestId,
|
||||
} from "@testing-library/dom";
|
||||
import { cssToObject } from "@uppercod/css-to-object";
|
||||
import { renderStatsCard } from "../src/cards/stats-card.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
import { CustomError } from "../src/common/utils.js";
|
||||
|
||||
// adds special assertions like toHaveTextContent
|
||||
import "@testing-library/jest-dom";
|
||||
|
||||
import { themes } from "../themes/index.js";
|
||||
|
||||
const stats = {
|
||||
name: "Anurag Hazra",
|
||||
totalStars: 100,
|
||||
totalCommits: 200,
|
||||
totalIssues: 300,
|
||||
totalPRs: 400,
|
||||
totalPRsMerged: 320,
|
||||
mergedPRsPercentage: 80,
|
||||
totalReviews: 50,
|
||||
totalDiscussionsStarted: 10,
|
||||
totalDiscussionsAnswered: 50,
|
||||
contributedTo: 500,
|
||||
rank: { level: "A+", percentile: 40 },
|
||||
};
|
||||
|
||||
describe("Test renderStatsCard", () => {
|
||||
it("should render correctly", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats);
|
||||
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"Anurag Hazra's GitHub Stats",
|
||||
);
|
||||
|
||||
expect(
|
||||
document.body.getElementsByTagName("svg")[0].getAttribute("height"),
|
||||
).toBe("195");
|
||||
expect(getByTestId(document.body, "stars").textContent).toBe("100");
|
||||
expect(getByTestId(document.body, "commits").textContent).toBe("200");
|
||||
expect(getByTestId(document.body, "issues").textContent).toBe("300");
|
||||
expect(getByTestId(document.body, "prs").textContent).toBe("400");
|
||||
expect(getByTestId(document.body, "contribs").textContent).toBe("500");
|
||||
expect(queryByTestId(document.body, "card-bg")).toBeInTheDocument();
|
||||
expect(queryByTestId(document.body, "rank-circle")).toBeInTheDocument();
|
||||
|
||||
// Default hidden stats
|
||||
expect(queryByTestId(document.body, "reviews")).not.toBeInTheDocument();
|
||||
expect(
|
||||
queryByTestId(document.body, "discussions_started"),
|
||||
).not.toBeInTheDocument();
|
||||
expect(
|
||||
queryByTestId(document.body, "discussions_answered"),
|
||||
).not.toBeInTheDocument();
|
||||
expect(queryByTestId(document.body, "prs_merged")).not.toBeInTheDocument();
|
||||
expect(
|
||||
queryByTestId(document.body, "prs_merged_percentage"),
|
||||
).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("should have proper name apostrophe", () => {
|
||||
document.body.innerHTML = renderStatsCard({ ...stats, name: "Anil Das" });
|
||||
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"Anil Das' GitHub Stats",
|
||||
);
|
||||
|
||||
document.body.innerHTML = renderStatsCard({ ...stats, name: "Felix" });
|
||||
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"Felix' GitHub Stats",
|
||||
);
|
||||
});
|
||||
|
||||
it("should hide individual stats", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
hide: ["issues", "prs", "contribs"],
|
||||
});
|
||||
|
||||
expect(
|
||||
document.body.getElementsByTagName("svg")[0].getAttribute("height"),
|
||||
).toBe("150"); // height should be 150 because we clamped it.
|
||||
|
||||
expect(queryByTestId(document.body, "stars")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "commits")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "issues")).toBeNull();
|
||||
expect(queryByTestId(document.body, "prs")).toBeNull();
|
||||
expect(queryByTestId(document.body, "contribs")).toBeNull();
|
||||
expect(queryByTestId(document.body, "reviews")).toBeNull();
|
||||
expect(queryByTestId(document.body, "discussions_started")).toBeNull();
|
||||
expect(queryByTestId(document.body, "discussions_answered")).toBeNull();
|
||||
expect(queryByTestId(document.body, "prs_merged")).toBeNull();
|
||||
expect(queryByTestId(document.body, "prs_merged_percentage")).toBeNull();
|
||||
});
|
||||
|
||||
it("should show additional stats", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
show: [
|
||||
"reviews",
|
||||
"discussions_started",
|
||||
"discussions_answered",
|
||||
"prs_merged",
|
||||
"prs_merged_percentage",
|
||||
],
|
||||
});
|
||||
|
||||
expect(
|
||||
document.body.getElementsByTagName("svg")[0].getAttribute("height"),
|
||||
).toBe("320");
|
||||
|
||||
expect(queryByTestId(document.body, "stars")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "commits")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "issues")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "prs")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "contribs")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "reviews")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "discussions_started")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "discussions_answered")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "prs_merged")).toBeDefined();
|
||||
expect(queryByTestId(document.body, "prs_merged_percentage")).toBeDefined();
|
||||
});
|
||||
|
||||
it("should hide_rank", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, { hide_rank: true });
|
||||
|
||||
expect(queryByTestId(document.body, "rank-circle")).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("should render with custom width set", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats);
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "450");
|
||||
|
||||
document.body.innerHTML = renderStatsCard(stats, { card_width: 500 });
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "500");
|
||||
});
|
||||
|
||||
it("should render with custom width set and limit minimum width", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, { card_width: 1 });
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "1");
|
||||
|
||||
// Test default minimum card width without rank circle.
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
card_width: 1,
|
||||
hide_rank: true,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "1");
|
||||
|
||||
// Test minimum card width with rank and icons.
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
card_width: 1,
|
||||
hide_rank: true,
|
||||
show_icons: true,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "1");
|
||||
|
||||
// Test minimum card width with icons but without rank.
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
card_width: 1,
|
||||
hide_rank: false,
|
||||
show_icons: true,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "1");
|
||||
|
||||
// Test minimum card width without icons or rank.
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
card_width: 1,
|
||||
hide_rank: false,
|
||||
show_icons: false,
|
||||
});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "1");
|
||||
});
|
||||
|
||||
it("should render default colors properly", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats);
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.textContent);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe("#2f80ed");
|
||||
expect(statClassStyles.fill.trim()).toBe("#434d58");
|
||||
expect(iconClassStyles.fill.trim()).toBe("#4c71f2");
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#fffefe",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors properly", () => {
|
||||
const customColors = {
|
||||
title_color: "5a0",
|
||||
icon_color: "1b998b",
|
||||
text_color: "9991",
|
||||
bg_color: "252525",
|
||||
};
|
||||
|
||||
document.body.innerHTML = renderStatsCard(stats, { ...customColors });
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(`#${customColors.title_color}`);
|
||||
expect(statClassStyles.fill.trim()).toBe(`#${customColors.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${customColors.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#252525",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors with themes", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
title_color: "5a0",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe("#5a0");
|
||||
expect(statClassStyles.fill.trim()).toBe(`#${themes.radical.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with all the themes", () => {
|
||||
Object.keys(themes).forEach((name) => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
theme: name,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes[name].title_color}`,
|
||||
);
|
||||
expect(statClassStyles.fill.trim()).toBe(`#${themes[name].text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes[name].icon_color}`);
|
||||
const backgroundElement = queryByTestId(document.body, "card-bg");
|
||||
const backgroundElementFill = backgroundElement.getAttribute("fill");
|
||||
expect([`#${themes[name].bg_color}`, "url(#gradient)"]).toContain(
|
||||
backgroundElementFill,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it("should render custom colors with themes and fallback to default colors if invalid", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
title_color: "invalid color",
|
||||
text_color: "invalid color",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(
|
||||
`#${themes.default.title_color}`,
|
||||
);
|
||||
expect(statClassStyles.fill.trim()).toBe(`#${themes.default.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${themes.radical.icon_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom ring_color properly", () => {
|
||||
const customColors = {
|
||||
title_color: "5a0",
|
||||
ring_color: "0000ff",
|
||||
icon_color: "1b998b",
|
||||
text_color: "9991",
|
||||
bg_color: "252525",
|
||||
};
|
||||
|
||||
document.body.innerHTML = renderStatsCard(stats, { ...customColors });
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const statClassStyles = stylesObject[":host"][".stat "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
const rankCircleStyles = stylesObject[":host"][".rank-circle "];
|
||||
const rankCircleRimStyles = stylesObject[":host"][".rank-circle-rim "];
|
||||
|
||||
expect(headerClassStyles.fill.trim()).toBe(`#${customColors.title_color}`);
|
||||
expect(statClassStyles.fill.trim()).toBe(`#${customColors.text_color}`);
|
||||
expect(iconClassStyles.fill.trim()).toBe(`#${customColors.icon_color}`);
|
||||
expect(rankCircleStyles.stroke.trim()).toBe(`#${customColors.ring_color}`);
|
||||
expect(rankCircleRimStyles.stroke.trim()).toBe(
|
||||
`#${customColors.ring_color}`,
|
||||
);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#252525",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render icons correctly", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
show_icons: true,
|
||||
});
|
||||
|
||||
expect(queryAllByTestId(document.body, "icon")[0]).toBeDefined();
|
||||
expect(queryByTestId(document.body, "stars")).toBeDefined();
|
||||
expect(
|
||||
queryByTestId(document.body, "stars").previousElementSibling, // the label
|
||||
).toHaveAttribute("x", "25");
|
||||
});
|
||||
|
||||
it("should not have icons if show_icons is false", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, { show_icons: false });
|
||||
|
||||
expect(queryAllByTestId(document.body, "icon")[0]).not.toBeDefined();
|
||||
expect(queryByTestId(document.body, "stars")).toBeDefined();
|
||||
expect(
|
||||
queryByTestId(document.body, "stars").previousElementSibling, // the label
|
||||
).not.toHaveAttribute("x");
|
||||
});
|
||||
|
||||
it("should auto resize if hide_rank is true", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
hide_rank: true,
|
||||
});
|
||||
|
||||
expect(
|
||||
document.body.getElementsByTagName("svg")[0].getAttribute("width"),
|
||||
).toBe("305.81250000000006");
|
||||
});
|
||||
|
||||
it("should auto resize if hide_rank is true & custom_title is set", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
hide_rank: true,
|
||||
custom_title: "Hello world",
|
||||
});
|
||||
|
||||
expect(
|
||||
document.body.getElementsByTagName("svg")[0].getAttribute("width"),
|
||||
).toBe("287");
|
||||
});
|
||||
|
||||
it("should render translations", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, { locale: "cn" });
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"Anurag Hazra 的 GitHub 统计数据",
|
||||
);
|
||||
expect(
|
||||
document.querySelector(
|
||||
'g[transform="translate(0, 0)"]>.stagger>.stat.bold',
|
||||
).textContent,
|
||||
).toMatchInlineSnapshot(`"获标星数（star）:"`);
|
||||
expect(
|
||||
document.querySelector(
|
||||
'g[transform="translate(0, 25)"]>.stagger>.stat.bold',
|
||||
).textContent,
|
||||
).toMatchInlineSnapshot(
|
||||
`"累计提交数（commit） (${new Date().getFullYear()}):"`,
|
||||
);
|
||||
expect(
|
||||
document.querySelector(
|
||||
'g[transform="translate(0, 50)"]>.stagger>.stat.bold',
|
||||
).textContent,
|
||||
).toMatchInlineSnapshot(`"拉取请求数（PR）:"`);
|
||||
expect(
|
||||
document.querySelector(
|
||||
'g[transform="translate(0, 75)"]>.stagger>.stat.bold',
|
||||
).textContent,
|
||||
).toMatchInlineSnapshot(`"指出问题数（issue）:"`);
|
||||
expect(
|
||||
document.querySelector(
|
||||
'g[transform="translate(0, 100)"]>.stagger>.stat.bold',
|
||||
).textContent,
|
||||
).toMatchInlineSnapshot(`"贡献于（去年）:"`);
|
||||
});
|
||||
|
||||
it("should render without rounding", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, { border_radius: "0" });
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "0");
|
||||
document.body.innerHTML = renderStatsCard(stats, {});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
|
||||
});
|
||||
|
||||
it("should shorten values", () => {
|
||||
stats["totalCommits"] = 1999;
|
||||
|
||||
document.body.innerHTML = renderStatsCard(stats);
|
||||
expect(getByTestId(document.body, "commits").textContent).toBe("2k");
|
||||
document.body.innerHTML = renderStatsCard(stats, { number_format: "long" });
|
||||
expect(getByTestId(document.body, "commits").textContent).toBe("1999");
|
||||
});
|
||||
|
||||
it("should render default rank icon with level A+", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
rank_icon: "default",
|
||||
});
|
||||
expect(queryByTestId(document.body, "level-rank-icon")).toBeDefined();
|
||||
expect(
|
||||
queryByTestId(document.body, "level-rank-icon").textContent.trim(),
|
||||
).toBe("A+");
|
||||
});
|
||||
|
||||
it("should render github rank icon", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
rank_icon: "github",
|
||||
});
|
||||
expect(queryByTestId(document.body, "github-rank-icon")).toBeDefined();
|
||||
});
|
||||
|
||||
it("should show the rank percentile", () => {
|
||||
document.body.innerHTML = renderStatsCard(stats, {
|
||||
rank_icon: "percentile",
|
||||
});
|
||||
expect(queryByTestId(document.body, "percentile-top-header")).toBeDefined();
|
||||
expect(
|
||||
queryByTestId(document.body, "percentile-top-header").textContent.trim(),
|
||||
).toBe("Top");
|
||||
expect(queryByTestId(document.body, "rank-percentile-text")).toBeDefined();
|
||||
expect(
|
||||
queryByTestId(document.body, "percentile-rank-value").textContent.trim(),
|
||||
).toBe(stats.rank.percentile.toFixed(1) + "%");
|
||||
});
|
||||
|
||||
it("should throw error if all stats and rank icon are hidden", () => {
|
||||
expect(() =>
|
||||
renderStatsCard(stats, {
|
||||
hide: ["stars", "commits", "prs", "issues", "contribs"],
|
||||
hide_rank: true,
|
||||
}),
|
||||
).toThrow(
|
||||
new CustomError(
|
||||
"Could not render stats card.",
|
||||
"Either stats or rank are required.",
|
||||
),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,852 @@
|
||||
import { queryAllByTestId, queryByTestId } from "@testing-library/dom";
|
||||
import { cssToObject } from "@uppercod/css-to-object";
|
||||
import {
|
||||
getLongestLang,
|
||||
degreesToRadians,
|
||||
radiansToDegrees,
|
||||
polarToCartesian,
|
||||
cartesianToPolar,
|
||||
getCircleLength,
|
||||
calculateCompactLayoutHeight,
|
||||
calculateNormalLayoutHeight,
|
||||
calculateDonutLayoutHeight,
|
||||
calculateDonutVerticalLayoutHeight,
|
||||
calculatePieLayoutHeight,
|
||||
donutCenterTranslation,
|
||||
trimTopLanguages,
|
||||
renderTopLanguages,
|
||||
MIN_CARD_WIDTH,
|
||||
getDefaultLanguagesCountByLayout,
|
||||
} from "../src/cards/top-languages-card.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
// adds special assertions like toHaveTextContent
|
||||
import "@testing-library/jest-dom";
|
||||
|
||||
import { themes } from "../themes/index.js";
|
||||
|
||||
const langs = {
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
name: "HTML",
|
||||
size: 200,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
name: "javascript",
|
||||
size: 200,
|
||||
},
|
||||
css: {
|
||||
color: "#ff0",
|
||||
name: "css",
|
||||
size: 100,
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Retrieve number array from SVG path definition string.
|
||||
*
|
||||
* @param {string} d SVG path definition string.
|
||||
* @returns {number[]} Resulting numbers array.
|
||||
*/
|
||||
const getNumbersFromSvgPathDefinitionAttribute = (d) => {
|
||||
return d
|
||||
.split(" ")
|
||||
.filter((x) => !isNaN(x))
|
||||
.map((x) => parseFloat(x));
|
||||
};
|
||||
|
||||
/**
|
||||
* Retrieve the language percentage from the donut chart SVG.
|
||||
*
|
||||
* @param {string} d The SVG path element.
|
||||
* @param {number} centerX The center X coordinate of the donut chart.
|
||||
* @param {number} centerY The center Y coordinate of the donut chart.
|
||||
* @returns {number} The percentage of the language.
|
||||
*/
|
||||
const langPercentFromDonutLayoutSvg = (d, centerX, centerY) => {
|
||||
const dTmp = getNumbersFromSvgPathDefinitionAttribute(d);
|
||||
const endAngle =
|
||||
cartesianToPolar(centerX, centerY, dTmp[0], dTmp[1]).angleInDegrees + 90;
|
||||
let startAngle =
|
||||
cartesianToPolar(centerX, centerY, dTmp[7], dTmp[8]).angleInDegrees + 90;
|
||||
if (startAngle > endAngle) {
|
||||
startAngle -= 360;
|
||||
}
|
||||
return (endAngle - startAngle) / 3.6;
|
||||
};
|
||||
|
||||
/**
|
||||
* Calculate language percentage for donut vertical chart SVG.
|
||||
*
|
||||
* @param {number} partLength Length of current chart part..
|
||||
* @param {number} totalCircleLength Total length of circle.
|
||||
* @returns {number} Chart part percentage.
|
||||
*/
|
||||
const langPercentFromDonutVerticalLayoutSvg = (
|
||||
partLength,
|
||||
totalCircleLength,
|
||||
) => {
|
||||
return (partLength / totalCircleLength) * 100;
|
||||
};
|
||||
|
||||
/**
|
||||
* Retrieve the language percentage from the pie chart SVG.
|
||||
*
|
||||
* @param {string} d The SVG path element.
|
||||
* @param {number} centerX The center X coordinate of the pie chart.
|
||||
* @param {number} centerY The center Y coordinate of the pie chart.
|
||||
* @returns {number} The percentage of the language.
|
||||
*/
|
||||
const langPercentFromPieLayoutSvg = (d, centerX, centerY) => {
|
||||
const dTmp = getNumbersFromSvgPathDefinitionAttribute(d);
|
||||
const startAngle = cartesianToPolar(
|
||||
centerX,
|
||||
centerY,
|
||||
dTmp[2],
|
||||
dTmp[3],
|
||||
).angleInDegrees;
|
||||
let endAngle = cartesianToPolar(
|
||||
centerX,
|
||||
centerY,
|
||||
dTmp[9],
|
||||
dTmp[10],
|
||||
).angleInDegrees;
|
||||
return ((endAngle - startAngle) / 360) * 100;
|
||||
};
|
||||
|
||||
describe("Test renderTopLanguages helper functions", () => {
|
||||
it("getLongestLang", () => {
|
||||
const langArray = Object.values(langs);
|
||||
expect(getLongestLang(langArray)).toBe(langs.javascript);
|
||||
});
|
||||
|
||||
it("degreesToRadians", () => {
|
||||
expect(degreesToRadians(0)).toBe(0);
|
||||
expect(degreesToRadians(90)).toBe(Math.PI / 2);
|
||||
expect(degreesToRadians(180)).toBe(Math.PI);
|
||||
expect(degreesToRadians(270)).toBe((3 * Math.PI) / 2);
|
||||
expect(degreesToRadians(360)).toBe(2 * Math.PI);
|
||||
});
|
||||
|
||||
it("radiansToDegrees", () => {
|
||||
expect(radiansToDegrees(0)).toBe(0);
|
||||
expect(radiansToDegrees(Math.PI / 2)).toBe(90);
|
||||
expect(radiansToDegrees(Math.PI)).toBe(180);
|
||||
expect(radiansToDegrees((3 * Math.PI) / 2)).toBe(270);
|
||||
expect(radiansToDegrees(2 * Math.PI)).toBe(360);
|
||||
});
|
||||
|
||||
it("polarToCartesian", () => {
|
||||
expect(polarToCartesian(100, 100, 60, 0)).toStrictEqual({ x: 160, y: 100 });
|
||||
expect(polarToCartesian(100, 100, 60, 45)).toStrictEqual({
|
||||
x: 142.42640687119285,
|
||||
y: 142.42640687119285,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 90)).toStrictEqual({
|
||||
x: 100,
|
||||
y: 160,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 135)).toStrictEqual({
|
||||
x: 57.573593128807154,
|
||||
y: 142.42640687119285,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 180)).toStrictEqual({
|
||||
x: 40,
|
||||
y: 100.00000000000001,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 225)).toStrictEqual({
|
||||
x: 57.57359312880714,
|
||||
y: 57.573593128807154,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 270)).toStrictEqual({
|
||||
x: 99.99999999999999,
|
||||
y: 40,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 315)).toStrictEqual({
|
||||
x: 142.42640687119285,
|
||||
y: 57.57359312880714,
|
||||
});
|
||||
expect(polarToCartesian(100, 100, 60, 360)).toStrictEqual({
|
||||
x: 160,
|
||||
y: 99.99999999999999,
|
||||
});
|
||||
});
|
||||
|
||||
it("cartesianToPolar", () => {
|
||||
expect(cartesianToPolar(100, 100, 160, 100)).toStrictEqual({
|
||||
radius: 60,
|
||||
angleInDegrees: 0,
|
||||
});
|
||||
expect(
|
||||
cartesianToPolar(100, 100, 142.42640687119285, 142.42640687119285),
|
||||
).toStrictEqual({ radius: 60.00000000000001, angleInDegrees: 45 });
|
||||
expect(cartesianToPolar(100, 100, 100, 160)).toStrictEqual({
|
||||
radius: 60,
|
||||
angleInDegrees: 90,
|
||||
});
|
||||
expect(
|
||||
cartesianToPolar(100, 100, 57.573593128807154, 142.42640687119285),
|
||||
).toStrictEqual({ radius: 60, angleInDegrees: 135 });
|
||||
expect(cartesianToPolar(100, 100, 40, 100.00000000000001)).toStrictEqual({
|
||||
radius: 60,
|
||||
angleInDegrees: 180,
|
||||
});
|
||||
expect(
|
||||
cartesianToPolar(100, 100, 57.57359312880714, 57.573593128807154),
|
||||
).toStrictEqual({ radius: 60, angleInDegrees: 225 });
|
||||
expect(cartesianToPolar(100, 100, 99.99999999999999, 40)).toStrictEqual({
|
||||
radius: 60,
|
||||
angleInDegrees: 270,
|
||||
});
|
||||
expect(
|
||||
cartesianToPolar(100, 100, 142.42640687119285, 57.57359312880714),
|
||||
).toStrictEqual({ radius: 60.00000000000001, angleInDegrees: 315 });
|
||||
expect(cartesianToPolar(100, 100, 160, 99.99999999999999)).toStrictEqual({
|
||||
radius: 60,
|
||||
angleInDegrees: 360,
|
||||
});
|
||||
});
|
||||
|
||||
it("calculateCompactLayoutHeight", () => {
|
||||
expect(calculateCompactLayoutHeight(0)).toBe(90);
|
||||
expect(calculateCompactLayoutHeight(1)).toBe(115);
|
||||
expect(calculateCompactLayoutHeight(2)).toBe(115);
|
||||
expect(calculateCompactLayoutHeight(3)).toBe(140);
|
||||
expect(calculateCompactLayoutHeight(4)).toBe(140);
|
||||
expect(calculateCompactLayoutHeight(5)).toBe(165);
|
||||
expect(calculateCompactLayoutHeight(6)).toBe(165);
|
||||
expect(calculateCompactLayoutHeight(7)).toBe(190);
|
||||
expect(calculateCompactLayoutHeight(8)).toBe(190);
|
||||
expect(calculateCompactLayoutHeight(9)).toBe(215);
|
||||
expect(calculateCompactLayoutHeight(10)).toBe(215);
|
||||
});
|
||||
|
||||
it("calculateNormalLayoutHeight", () => {
|
||||
expect(calculateNormalLayoutHeight(0)).toBe(85);
|
||||
expect(calculateNormalLayoutHeight(1)).toBe(125);
|
||||
expect(calculateNormalLayoutHeight(2)).toBe(165);
|
||||
expect(calculateNormalLayoutHeight(3)).toBe(205);
|
||||
expect(calculateNormalLayoutHeight(4)).toBe(245);
|
||||
expect(calculateNormalLayoutHeight(5)).toBe(285);
|
||||
expect(calculateNormalLayoutHeight(6)).toBe(325);
|
||||
expect(calculateNormalLayoutHeight(7)).toBe(365);
|
||||
expect(calculateNormalLayoutHeight(8)).toBe(405);
|
||||
expect(calculateNormalLayoutHeight(9)).toBe(445);
|
||||
expect(calculateNormalLayoutHeight(10)).toBe(485);
|
||||
});
|
||||
|
||||
it("calculateDonutLayoutHeight", () => {
|
||||
expect(calculateDonutLayoutHeight(0)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(1)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(2)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(3)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(4)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(5)).toBe(215);
|
||||
expect(calculateDonutLayoutHeight(6)).toBe(247);
|
||||
expect(calculateDonutLayoutHeight(7)).toBe(279);
|
||||
expect(calculateDonutLayoutHeight(8)).toBe(311);
|
||||
expect(calculateDonutLayoutHeight(9)).toBe(343);
|
||||
expect(calculateDonutLayoutHeight(10)).toBe(375);
|
||||
});
|
||||
|
||||
it("calculateDonutVerticalLayoutHeight", () => {
|
||||
expect(calculateDonutVerticalLayoutHeight(0)).toBe(300);
|
||||
expect(calculateDonutVerticalLayoutHeight(1)).toBe(325);
|
||||
expect(calculateDonutVerticalLayoutHeight(2)).toBe(325);
|
||||
expect(calculateDonutVerticalLayoutHeight(3)).toBe(350);
|
||||
expect(calculateDonutVerticalLayoutHeight(4)).toBe(350);
|
||||
expect(calculateDonutVerticalLayoutHeight(5)).toBe(375);
|
||||
expect(calculateDonutVerticalLayoutHeight(6)).toBe(375);
|
||||
expect(calculateDonutVerticalLayoutHeight(7)).toBe(400);
|
||||
expect(calculateDonutVerticalLayoutHeight(8)).toBe(400);
|
||||
expect(calculateDonutVerticalLayoutHeight(9)).toBe(425);
|
||||
expect(calculateDonutVerticalLayoutHeight(10)).toBe(425);
|
||||
});
|
||||
|
||||
it("calculatePieLayoutHeight", () => {
|
||||
expect(calculatePieLayoutHeight(0)).toBe(300);
|
||||
expect(calculatePieLayoutHeight(1)).toBe(325);
|
||||
expect(calculatePieLayoutHeight(2)).toBe(325);
|
||||
expect(calculatePieLayoutHeight(3)).toBe(350);
|
||||
expect(calculatePieLayoutHeight(4)).toBe(350);
|
||||
expect(calculatePieLayoutHeight(5)).toBe(375);
|
||||
expect(calculatePieLayoutHeight(6)).toBe(375);
|
||||
expect(calculatePieLayoutHeight(7)).toBe(400);
|
||||
expect(calculatePieLayoutHeight(8)).toBe(400);
|
||||
expect(calculatePieLayoutHeight(9)).toBe(425);
|
||||
expect(calculatePieLayoutHeight(10)).toBe(425);
|
||||
});
|
||||
|
||||
it("donutCenterTranslation", () => {
|
||||
expect(donutCenterTranslation(0)).toBe(-45);
|
||||
expect(donutCenterTranslation(1)).toBe(-45);
|
||||
expect(donutCenterTranslation(2)).toBe(-45);
|
||||
expect(donutCenterTranslation(3)).toBe(-45);
|
||||
expect(donutCenterTranslation(4)).toBe(-45);
|
||||
expect(donutCenterTranslation(5)).toBe(-45);
|
||||
expect(donutCenterTranslation(6)).toBe(-29);
|
||||
expect(donutCenterTranslation(7)).toBe(-13);
|
||||
expect(donutCenterTranslation(8)).toBe(3);
|
||||
expect(donutCenterTranslation(9)).toBe(19);
|
||||
expect(donutCenterTranslation(10)).toBe(35);
|
||||
});
|
||||
|
||||
it("getCircleLength", () => {
|
||||
expect(getCircleLength(20)).toBeCloseTo(125.663);
|
||||
expect(getCircleLength(30)).toBeCloseTo(188.495);
|
||||
expect(getCircleLength(40)).toBeCloseTo(251.327);
|
||||
expect(getCircleLength(50)).toBeCloseTo(314.159);
|
||||
expect(getCircleLength(60)).toBeCloseTo(376.991);
|
||||
expect(getCircleLength(70)).toBeCloseTo(439.822);
|
||||
expect(getCircleLength(80)).toBeCloseTo(502.654);
|
||||
expect(getCircleLength(90)).toBeCloseTo(565.486);
|
||||
expect(getCircleLength(100)).toBeCloseTo(628.318);
|
||||
});
|
||||
|
||||
it("trimTopLanguages", () => {
|
||||
expect(trimTopLanguages([])).toStrictEqual({
|
||||
langs: [],
|
||||
totalLanguageSize: 0,
|
||||
});
|
||||
expect(trimTopLanguages([langs.javascript])).toStrictEqual({
|
||||
langs: [langs.javascript],
|
||||
totalLanguageSize: 200,
|
||||
});
|
||||
expect(trimTopLanguages([langs.javascript, langs.HTML], 5)).toStrictEqual({
|
||||
langs: [langs.javascript, langs.HTML],
|
||||
totalLanguageSize: 400,
|
||||
});
|
||||
expect(trimTopLanguages(langs, 5)).toStrictEqual({
|
||||
langs: Object.values(langs),
|
||||
totalLanguageSize: 500,
|
||||
});
|
||||
expect(trimTopLanguages(langs, 2)).toStrictEqual({
|
||||
langs: Object.values(langs).slice(0, 2),
|
||||
totalLanguageSize: 400,
|
||||
});
|
||||
expect(trimTopLanguages(langs, 5, ["javascript"])).toStrictEqual({
|
||||
langs: [langs.HTML, langs.css],
|
||||
totalLanguageSize: 300,
|
||||
});
|
||||
});
|
||||
|
||||
it("getDefaultLanguagesCountByLayout", () => {
|
||||
expect(
|
||||
getDefaultLanguagesCountByLayout({ layout: "normal" }),
|
||||
).toStrictEqual(5);
|
||||
expect(getDefaultLanguagesCountByLayout({})).toStrictEqual(5);
|
||||
expect(
|
||||
getDefaultLanguagesCountByLayout({ layout: "compact" }),
|
||||
).toStrictEqual(6);
|
||||
expect(
|
||||
getDefaultLanguagesCountByLayout({ hide_progress: true }),
|
||||
).toStrictEqual(6);
|
||||
expect(getDefaultLanguagesCountByLayout({ layout: "donut" })).toStrictEqual(
|
||||
5,
|
||||
);
|
||||
expect(
|
||||
getDefaultLanguagesCountByLayout({ layout: "donut-vertical" }),
|
||||
).toStrictEqual(6);
|
||||
expect(getDefaultLanguagesCountByLayout({ layout: "pie" })).toStrictEqual(
|
||||
6,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
describe("Test renderTopLanguages", () => {
|
||||
it("should render correctly", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs);
|
||||
|
||||
expect(queryByTestId(document.body, "header")).toHaveTextContent(
|
||||
"Most Used Languages",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toHaveTextContent(
|
||||
"javascript",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).toHaveTextContent(
|
||||
"css",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[0]).toHaveAttribute(
|
||||
"width",
|
||||
"40%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[1]).toHaveAttribute(
|
||||
"width",
|
||||
"40%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[2]).toHaveAttribute(
|
||||
"width",
|
||||
"20%",
|
||||
);
|
||||
});
|
||||
|
||||
it("should hide languages when hide is passed", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {
|
||||
hide: ["HTML"],
|
||||
});
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toBeInTheDocument(
|
||||
"javascript",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toBeInTheDocument(
|
||||
"css",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).not.toBeDefined();
|
||||
|
||||
// multiple languages passed
|
||||
document.body.innerHTML = renderTopLanguages(langs, {
|
||||
hide: ["HTML", "css"],
|
||||
});
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toBeInTheDocument(
|
||||
"javascript",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).not.toBeDefined();
|
||||
});
|
||||
|
||||
it("should resize the height correctly depending on langs", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {});
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "205");
|
||||
|
||||
document.body.innerHTML = renderTopLanguages(
|
||||
{
|
||||
...langs,
|
||||
python: {
|
||||
color: "#ff0",
|
||||
name: "python",
|
||||
size: 100,
|
||||
},
|
||||
},
|
||||
{},
|
||||
);
|
||||
expect(document.querySelector("svg")).toHaveAttribute("height", "245");
|
||||
});
|
||||
|
||||
it("should render with custom width set", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {});
|
||||
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "300");
|
||||
|
||||
document.body.innerHTML = renderTopLanguages(langs, { card_width: 400 });
|
||||
expect(document.querySelector("svg")).toHaveAttribute("width", "400");
|
||||
});
|
||||
|
||||
it("should render with min width", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { card_width: 190 });
|
||||
|
||||
expect(document.querySelector("svg")).toHaveAttribute(
|
||||
"width",
|
||||
MIN_CARD_WIDTH.toString(),
|
||||
);
|
||||
|
||||
document.body.innerHTML = renderTopLanguages(langs, { card_width: 100 });
|
||||
expect(document.querySelector("svg")).toHaveAttribute(
|
||||
"width",
|
||||
MIN_CARD_WIDTH.toString(),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render default colors properly", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs);
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.textContent);
|
||||
|
||||
const headerStyles = stylesObject[":host"][".header "];
|
||||
const langNameStyles = stylesObject[":host"][".lang-name "];
|
||||
|
||||
expect(headerStyles.fill.trim()).toBe("#2f80ed");
|
||||
expect(langNameStyles.fill.trim()).toBe("#434d58");
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#fffefe",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors properly", () => {
|
||||
const customColors = {
|
||||
title_color: "5a0",
|
||||
icon_color: "1b998b",
|
||||
text_color: "9991",
|
||||
bg_color: "252525",
|
||||
};
|
||||
|
||||
document.body.innerHTML = renderTopLanguages(langs, { ...customColors });
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerStyles = stylesObject[":host"][".header "];
|
||||
const langNameStyles = stylesObject[":host"][".lang-name "];
|
||||
|
||||
expect(headerStyles.fill.trim()).toBe(`#${customColors.title_color}`);
|
||||
expect(langNameStyles.fill.trim()).toBe(`#${customColors.text_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#252525",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render custom colors with themes", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {
|
||||
title_color: "5a0",
|
||||
theme: "radical",
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerStyles = stylesObject[":host"][".header "];
|
||||
const langNameStyles = stylesObject[":host"][".lang-name "];
|
||||
|
||||
expect(headerStyles.fill.trim()).toBe("#5a0");
|
||||
expect(langNameStyles.fill.trim()).toBe(`#${themes.radical.text_color}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes.radical.bg_color}`,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with all the themes", () => {
|
||||
Object.keys(themes).forEach((name) => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {
|
||||
theme: name,
|
||||
});
|
||||
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerStyles = stylesObject[":host"][".header "];
|
||||
const langNameStyles = stylesObject[":host"][".lang-name "];
|
||||
|
||||
expect(headerStyles.fill.trim()).toBe(`#${themes[name].title_color}`);
|
||||
expect(langNameStyles.fill.trim()).toBe(`#${themes[name].text_color}`);
|
||||
const backgroundElement = queryByTestId(document.body, "card-bg");
|
||||
const backgroundElementFill = backgroundElement.getAttribute("fill");
|
||||
expect([`#${themes[name].bg_color}`, "url(#gradient)"]).toContain(
|
||||
backgroundElementFill,
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it("should render with layout compact", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { layout: "compact" });
|
||||
|
||||
expect(queryByTestId(document.body, "header")).toHaveTextContent(
|
||||
"Most Used Languages",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[0]).toHaveAttribute(
|
||||
"width",
|
||||
"100",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toHaveTextContent(
|
||||
"javascript 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[1]).toHaveAttribute(
|
||||
"width",
|
||||
"100",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).toHaveTextContent(
|
||||
"css 20.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-progress")[2]).toHaveAttribute(
|
||||
"width",
|
||||
"50",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with layout donut", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { layout: "donut" });
|
||||
|
||||
expect(queryByTestId(document.body, "header")).toHaveTextContent(
|
||||
"Most Used Languages",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
const d = getNumbersFromSvgPathDefinitionAttribute(
|
||||
queryAllByTestId(document.body, "lang-donut")[0].getAttribute("d"),
|
||||
);
|
||||
const center = { x: d[7], y: d[7] };
|
||||
const HTMLLangPercent = langPercentFromDonutLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-donut")[0].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(HTMLLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toHaveTextContent(
|
||||
"javascript 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[1]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
const javascriptLangPercent = langPercentFromDonutLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-donut")[1].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(javascriptLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).toHaveTextContent(
|
||||
"css 20.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[2]).toHaveAttribute(
|
||||
"size",
|
||||
"20",
|
||||
);
|
||||
const cssLangPercent = langPercentFromDonutLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-donut")[2].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(cssLangPercent).toBeCloseTo(20);
|
||||
|
||||
expect(HTMLLangPercent + javascriptLangPercent + cssLangPercent).toBe(100);
|
||||
|
||||
// Should render full donut (circle) if one language is 100%.
|
||||
document.body.innerHTML = renderTopLanguages(
|
||||
{ HTML: langs.HTML },
|
||||
{ layout: "donut" },
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 100.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"100",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")).toHaveLength(1);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[0].tagName).toBe(
|
||||
"circle",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render with layout donut vertical", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, {
|
||||
layout: "donut-vertical",
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, "header")).toHaveTextContent(
|
||||
"Most Used Languages",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
|
||||
const totalCircleLength = queryAllByTestId(
|
||||
document.body,
|
||||
"lang-donut",
|
||||
)[0].getAttribute("stroke-dasharray");
|
||||
|
||||
const HTMLLangPercent = langPercentFromDonutVerticalLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-donut")[1].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
) -
|
||||
queryAllByTestId(document.body, "lang-donut")[0].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
),
|
||||
totalCircleLength,
|
||||
);
|
||||
expect(HTMLLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toHaveTextContent(
|
||||
"javascript 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[1]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
const javascriptLangPercent = langPercentFromDonutVerticalLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-donut")[2].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
) -
|
||||
queryAllByTestId(document.body, "lang-donut")[1].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
),
|
||||
totalCircleLength,
|
||||
);
|
||||
expect(javascriptLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).toHaveTextContent(
|
||||
"css 20.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[2]).toHaveAttribute(
|
||||
"size",
|
||||
"20",
|
||||
);
|
||||
const cssLangPercent = langPercentFromDonutVerticalLayoutSvg(
|
||||
totalCircleLength -
|
||||
queryAllByTestId(document.body, "lang-donut")[2].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
),
|
||||
totalCircleLength,
|
||||
);
|
||||
expect(cssLangPercent).toBeCloseTo(20);
|
||||
|
||||
expect(HTMLLangPercent + javascriptLangPercent + cssLangPercent).toBe(100);
|
||||
});
|
||||
|
||||
it("should render with layout donut vertical full donut circle of one language is 100%", () => {
|
||||
document.body.innerHTML = renderTopLanguages(
|
||||
{ HTML: langs.HTML },
|
||||
{ layout: "donut-vertical" },
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 100.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-donut")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"100",
|
||||
);
|
||||
const totalCircleLength = queryAllByTestId(
|
||||
document.body,
|
||||
"lang-donut",
|
||||
)[0].getAttribute("stroke-dasharray");
|
||||
|
||||
const HTMLLangPercent = langPercentFromDonutVerticalLayoutSvg(
|
||||
totalCircleLength -
|
||||
queryAllByTestId(document.body, "lang-donut")[0].getAttribute(
|
||||
"stroke-dashoffset",
|
||||
),
|
||||
totalCircleLength,
|
||||
);
|
||||
expect(HTMLLangPercent).toBeCloseTo(100);
|
||||
});
|
||||
|
||||
it("should render with layout pie", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { layout: "pie" });
|
||||
|
||||
expect(queryByTestId(document.body, "header")).toHaveTextContent(
|
||||
"Most Used Languages",
|
||||
);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
|
||||
const d = getNumbersFromSvgPathDefinitionAttribute(
|
||||
queryAllByTestId(document.body, "lang-pie")[0].getAttribute("d"),
|
||||
);
|
||||
const center = { x: d[0], y: d[1] };
|
||||
const HTMLLangPercent = langPercentFromPieLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-pie")[0].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(HTMLLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[1]).toHaveTextContent(
|
||||
"javascript 40.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")[1]).toHaveAttribute(
|
||||
"size",
|
||||
"40",
|
||||
);
|
||||
const javascriptLangPercent = langPercentFromPieLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-pie")[1].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(javascriptLangPercent).toBeCloseTo(40);
|
||||
|
||||
expect(queryAllByTestId(document.body, "lang-name")[2]).toHaveTextContent(
|
||||
"css 20.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")[2]).toHaveAttribute(
|
||||
"size",
|
||||
"20",
|
||||
);
|
||||
const cssLangPercent = langPercentFromPieLayoutSvg(
|
||||
queryAllByTestId(document.body, "lang-pie")[2].getAttribute("d"),
|
||||
center.x,
|
||||
center.y,
|
||||
);
|
||||
expect(cssLangPercent).toBeCloseTo(20);
|
||||
|
||||
expect(HTMLLangPercent + javascriptLangPercent + cssLangPercent).toBe(100);
|
||||
|
||||
// Should render full pie (circle) if one language is 100%.
|
||||
document.body.innerHTML = renderTopLanguages(
|
||||
{ HTML: langs.HTML },
|
||||
{ layout: "pie" },
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-name")[0]).toHaveTextContent(
|
||||
"HTML 100.00%",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")[0]).toHaveAttribute(
|
||||
"size",
|
||||
"100",
|
||||
);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")).toHaveLength(1);
|
||||
expect(queryAllByTestId(document.body, "lang-pie")[0].tagName).toBe(
|
||||
"circle",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render a translated title", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { locale: "cn" });
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"最常用的语言",
|
||||
);
|
||||
});
|
||||
|
||||
it("should render without rounding", () => {
|
||||
document.body.innerHTML = renderTopLanguages(langs, { border_radius: "0" });
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "0");
|
||||
document.body.innerHTML = renderTopLanguages(langs, {});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
|
||||
});
|
||||
|
||||
it("should render langs with specified langs_count", () => {
|
||||
const options = {
|
||||
langs_count: 1,
|
||||
};
|
||||
document.body.innerHTML = renderTopLanguages(langs, { ...options });
|
||||
expect(queryAllByTestId(document.body, "lang-name").length).toBe(
|
||||
options.langs_count,
|
||||
);
|
||||
});
|
||||
|
||||
it("should render langs with specified langs_count even when hide is set", () => {
|
||||
const options = {
|
||||
hide: ["HTML"],
|
||||
langs_count: 2,
|
||||
};
|
||||
document.body.innerHTML = renderTopLanguages(langs, { ...options });
|
||||
expect(queryAllByTestId(document.body, "lang-name").length).toBe(
|
||||
options.langs_count,
|
||||
);
|
||||
});
|
||||
|
||||
it('should show "No languages data." message instead of empty card when nothing to show', () => {
|
||||
document.body.innerHTML = renderTopLanguages({});
|
||||
expect(document.querySelector(".stat").textContent).toBe(
|
||||
"No languages data.",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,86 @@
|
||||
import { queryByTestId } from "@testing-library/dom";
|
||||
import "@testing-library/jest-dom";
|
||||
import { renderWakatimeCard } from "../src/cards/wakatime-card.js";
|
||||
import { getCardColors } from "../src/common/utils.js";
|
||||
import { wakaTimeData } from "./fetchWakatime.test.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
describe("Test Render WakaTime Card", () => {
|
||||
it("should render correctly", () => {
|
||||
// const card = renderWakatimeCard(wakaTimeData.data);
|
||||
expect(getCardColors).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should render correctly with compact layout", () => {
|
||||
const card = renderWakatimeCard(wakaTimeData.data, { layout: "compact" });
|
||||
|
||||
expect(card).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should render correctly with compact layout when langs_count is set", () => {
|
||||
const card = renderWakatimeCard(wakaTimeData.data, {
|
||||
layout: "compact",
|
||||
langs_count: 2,
|
||||
});
|
||||
|
||||
expect(card).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should hide languages when hide is passed", () => {
|
||||
document.body.innerHTML = renderWakatimeCard(wakaTimeData.data, {
|
||||
hide: ["YAML", "Other"],
|
||||
});
|
||||
|
||||
expect(queryByTestId(document.body, /YAML/i)).toBeNull();
|
||||
expect(queryByTestId(document.body, /Other/i)).toBeNull();
|
||||
expect(queryByTestId(document.body, /TypeScript/i)).not.toBeNull();
|
||||
});
|
||||
|
||||
it("should render translations", () => {
|
||||
document.body.innerHTML = renderWakatimeCard({}, { locale: "cn" });
|
||||
expect(document.getElementsByClassName("header")[0].textContent).toBe(
|
||||
"WakaTime 周统计",
|
||||
);
|
||||
expect(
|
||||
document.querySelector('g[transform="translate(0, 0)"]>text.stat.bold')
|
||||
.textContent,
|
||||
).toBe("WakaTime 用户个人资料未公开");
|
||||
});
|
||||
|
||||
it("should render without rounding", () => {
|
||||
document.body.innerHTML = renderWakatimeCard(wakaTimeData.data, {
|
||||
border_radius: "0",
|
||||
});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "0");
|
||||
document.body.innerHTML = renderWakatimeCard(wakaTimeData.data, {});
|
||||
expect(document.querySelector("rect")).toHaveAttribute("rx", "4.5");
|
||||
});
|
||||
|
||||
it('should show "no coding activity this week" message when there has not been activity', () => {
|
||||
document.body.innerHTML = renderWakatimeCard(
|
||||
{
|
||||
...wakaTimeData.data,
|
||||
languages: undefined,
|
||||
},
|
||||
{},
|
||||
);
|
||||
expect(document.querySelector(".stat").textContent).toBe(
|
||||
"No coding activity this week",
|
||||
);
|
||||
});
|
||||
|
||||
it('should show "no coding activity this week" message when using compact layout and there has not been activity', () => {
|
||||
document.body.innerHTML = renderWakatimeCard(
|
||||
{
|
||||
...wakaTimeData.data,
|
||||
languages: undefined,
|
||||
},
|
||||
{
|
||||
layout: "compact",
|
||||
},
|
||||
);
|
||||
expect(document.querySelector(".stat").textContent).toBe(
|
||||
"No coding activity this week",
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,51 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import "@testing-library/jest-dom";
|
||||
import { retryer, RETRIES } from "../src/common/retryer.js";
|
||||
import { logger } from "../src/common/utils.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
const fetcher = jest.fn((variables, token) => {
|
||||
logger.log(variables, token);
|
||||
return new Promise((res) => res({ data: "ok" }));
|
||||
});
|
||||
|
||||
const fetcherFail = jest.fn(() => {
|
||||
return new Promise((res) =>
|
||||
res({ data: { errors: [{ type: "RATE_LIMITED" }] } }),
|
||||
);
|
||||
});
|
||||
|
||||
const fetcherFailOnSecondTry = jest.fn((_vars, _token, retries) => {
|
||||
return new Promise((res) => {
|
||||
// faking rate limit
|
||||
if (retries < 1) {
|
||||
return res({ data: { errors: [{ type: "RATE_LIMITED" }] } });
|
||||
}
|
||||
return res({ data: "ok" });
|
||||
});
|
||||
});
|
||||
|
||||
describe("Test Retryer", () => {
|
||||
it("retryer should return value and have zero retries on first try", async () => {
|
||||
let res = await retryer(fetcher, {});
|
||||
|
||||
expect(fetcher).toBeCalledTimes(1);
|
||||
expect(res).toStrictEqual({ data: "ok" });
|
||||
});
|
||||
|
||||
it("retryer should return value and have 2 retries", async () => {
|
||||
let res = await retryer(fetcherFailOnSecondTry, {});
|
||||
|
||||
expect(fetcherFailOnSecondTry).toBeCalledTimes(2);
|
||||
expect(res).toStrictEqual({ data: "ok" });
|
||||
});
|
||||
|
||||
it("retryer should throw specific error if maximum retries reached", async () => {
|
||||
try {
|
||||
await retryer(fetcherFail, {});
|
||||
} catch (err) {
|
||||
expect(fetcherFail).toBeCalledTimes(RETRIES + 1);
|
||||
expect(err.message).toBe("Downtime due to GitHub API rate limiting");
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
//https://stackoverflow.com/a/68468204/1643179
|
||||
|
||||
import { TextEncoder, TextDecoder } from "util";
|
||||
|
||||
Object.assign(global, { TextDecoder, TextEncoder });
|
||||
@@ -0,0 +1,195 @@
|
||||
/**
|
||||
* @file Tests for the status/up cloud function.
|
||||
*/
|
||||
import { jest } from "@jest/globals";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import up, { RATE_LIMIT_SECONDS } from "../api/status/up.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
const successData = {
|
||||
rateLimit: {
|
||||
remaining: 4986,
|
||||
},
|
||||
};
|
||||
|
||||
const faker = (query) => {
|
||||
const req = {
|
||||
query: { ...query },
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
|
||||
return { req, res };
|
||||
};
|
||||
|
||||
const rate_limit_error = {
|
||||
errors: [
|
||||
{
|
||||
type: "RATE_LIMITED",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const bad_credentials_error = {
|
||||
message: "Bad credentials",
|
||||
};
|
||||
|
||||
const shields_up = {
|
||||
schemaVersion: 1,
|
||||
label: "Public Instance",
|
||||
isError: true,
|
||||
message: "up",
|
||||
color: "brightgreen",
|
||||
};
|
||||
const shields_down = {
|
||||
schemaVersion: 1,
|
||||
label: "Public Instance",
|
||||
isError: true,
|
||||
message: "down",
|
||||
color: "red",
|
||||
};
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/status/up", () => {
|
||||
it("should return `true` if request was successful", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(true);
|
||||
});
|
||||
|
||||
it("should return `false` if all PATs are rate limited", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, rate_limit_error);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(false);
|
||||
});
|
||||
|
||||
it("should return JSON `true` if request was successful and type='json'", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({ type: "json" }, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith({ up: true });
|
||||
});
|
||||
|
||||
it("should return JSON `false` if all PATs are rate limited and type='json'", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, rate_limit_error);
|
||||
|
||||
const { req, res } = faker({ type: "json" }, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith({ up: false });
|
||||
});
|
||||
|
||||
it("should return UP shields.io config if request was successful and type='shields'", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({ type: "shields" }, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(shields_up);
|
||||
});
|
||||
|
||||
it("should return DOWN shields.io config if all PATs are rate limited and type='shields'", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, rate_limit_error);
|
||||
|
||||
const { req, res } = faker({ type: "shields" }, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(shields_down);
|
||||
});
|
||||
|
||||
it("should return `true` if the first PAT is rate limited but the second PATs works", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, rate_limit_error)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(true);
|
||||
});
|
||||
|
||||
it("should return `true` if the first PAT has 'Bad credentials' but the second PAT works", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(404, bad_credentials_error)
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(true);
|
||||
});
|
||||
|
||||
it("should return `false` if all pats have 'Bad credentials'", async () => {
|
||||
mock
|
||||
.onPost("https://api.github.com/graphql")
|
||||
.reply(404, bad_credentials_error);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(false);
|
||||
});
|
||||
|
||||
it("should throw an error if the request fails", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").networkError();
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "application/json");
|
||||
expect(res.send).toBeCalledWith(false);
|
||||
});
|
||||
|
||||
it("should have proper cache when no error is thrown", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").replyOnce(200, successData);
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader.mock.calls).toEqual([
|
||||
["Content-Type", "application/json"],
|
||||
["Cache-Control", `max-age=0, s-maxage=${RATE_LIMIT_SECONDS}`],
|
||||
]);
|
||||
});
|
||||
|
||||
it("should have proper cache when error is thrown", async () => {
|
||||
mock.onPost("https://api.github.com/graphql").networkError();
|
||||
|
||||
const { req, res } = faker({}, {});
|
||||
await up(req, res);
|
||||
|
||||
expect(res.setHeader.mock.calls).toEqual([
|
||||
["Content-Type", "application/json"],
|
||||
["Cache-Control", "no-store"],
|
||||
]);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,211 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import topLangs from "../api/top-langs.js";
|
||||
import { renderTopLanguages } from "../src/cards/top-languages-card.js";
|
||||
import { renderError } from "../src/common/utils.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const data_langs = {
|
||||
data: {
|
||||
user: {
|
||||
repositories: {
|
||||
nodes: [
|
||||
{
|
||||
languages: {
|
||||
edges: [{ size: 150, node: { color: "#0f0", name: "HTML" } }],
|
||||
},
|
||||
},
|
||||
{
|
||||
languages: {
|
||||
edges: [{ size: 100, node: { color: "#0f0", name: "HTML" } }],
|
||||
},
|
||||
},
|
||||
{
|
||||
languages: {
|
||||
edges: [
|
||||
{ size: 100, node: { color: "#0ff", name: "javascript" } },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
languages: {
|
||||
edges: [
|
||||
{ size: 100, node: { color: "#0ff", name: "javascript" } },
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const error = {
|
||||
errors: [
|
||||
{
|
||||
type: "NOT_FOUND",
|
||||
path: ["user"],
|
||||
locations: [],
|
||||
message: "Could not fetch user",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const langs = {
|
||||
HTML: {
|
||||
color: "#0f0",
|
||||
name: "HTML",
|
||||
size: 250,
|
||||
},
|
||||
javascript: {
|
||||
color: "#0ff",
|
||||
name: "javascript",
|
||||
size: 200,
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/top-langs", () => {
|
||||
it("should test the request", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(renderTopLanguages(langs));
|
||||
});
|
||||
|
||||
it("should work with the query options", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
hide_title: true,
|
||||
card_width: 100,
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderTopLanguages(langs, {
|
||||
hide_title: true,
|
||||
card_width: 100,
|
||||
title_color: "fff",
|
||||
icon_color: "fff",
|
||||
text_color: "fff",
|
||||
bg_color: "fff",
|
||||
}),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card on user data fetch error", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, error);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError(
|
||||
error.errors[0].message,
|
||||
"Make sure the provided username is not an organization",
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card on incorrect layout input", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
layout: ["pie"],
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "Incorrect layout input"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if username in blacklist", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "renovate-bot",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "This username is blacklisted"),
|
||||
);
|
||||
});
|
||||
|
||||
it("should render error card if wrong locale provided", async () => {
|
||||
const req = {
|
||||
query: {
|
||||
username: "anuraghazra",
|
||||
locale: "asdf",
|
||||
},
|
||||
};
|
||||
const res = {
|
||||
setHeader: jest.fn(),
|
||||
send: jest.fn(),
|
||||
};
|
||||
mock.onPost("https://api.github.com/graphql").reply(200, data_langs);
|
||||
|
||||
await topLangs(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(
|
||||
renderError("Something went wrong", "Locale not found"),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,169 @@
|
||||
import { queryByTestId } from "@testing-library/dom";
|
||||
import "@testing-library/jest-dom";
|
||||
import {
|
||||
encodeHTML,
|
||||
getCardColors,
|
||||
kFormatter,
|
||||
parseBoolean,
|
||||
renderError,
|
||||
wrapTextMultiline,
|
||||
} from "../src/common/utils.js";
|
||||
import { expect, it, describe } from "@jest/globals";
|
||||
|
||||
describe("Test utils.js", () => {
|
||||
it("should test kFormatter", () => {
|
||||
expect(kFormatter(1)).toBe(1);
|
||||
expect(kFormatter(-1)).toBe(-1);
|
||||
expect(kFormatter(500)).toBe(500);
|
||||
expect(kFormatter(1000)).toBe("1k");
|
||||
expect(kFormatter(10000)).toBe("10k");
|
||||
expect(kFormatter(12345)).toBe("12.3k");
|
||||
expect(kFormatter(9900000)).toBe("9900k");
|
||||
});
|
||||
|
||||
it("should test parseBoolean", () => {
|
||||
expect(parseBoolean(true)).toBe(true);
|
||||
expect(parseBoolean(false)).toBe(false);
|
||||
|
||||
expect(parseBoolean("true")).toBe(true);
|
||||
expect(parseBoolean("false")).toBe(false);
|
||||
expect(parseBoolean("True")).toBe(true);
|
||||
expect(parseBoolean("False")).toBe(false);
|
||||
expect(parseBoolean("TRUE")).toBe(true);
|
||||
expect(parseBoolean("FALSE")).toBe(false);
|
||||
|
||||
expect(parseBoolean("1")).toBe(undefined);
|
||||
expect(parseBoolean("0")).toBe(undefined);
|
||||
expect(parseBoolean("")).toBe(undefined);
|
||||
expect(parseBoolean(undefined)).toBe(undefined);
|
||||
});
|
||||
|
||||
it("should test encodeHTML", () => {
|
||||
expect(encodeHTML(`<html>hello world<,.#4^&^@%!))`)).toBe(
|
||||
"<html>hello world<,.#4^&^@%!))",
|
||||
);
|
||||
});
|
||||
|
||||
it("should test renderError", () => {
|
||||
document.body.innerHTML = renderError("Something went wrong");
|
||||
expect(
|
||||
queryByTestId(document.body, "message").children[0],
|
||||
).toHaveTextContent(/Something went wrong/gim);
|
||||
expect(
|
||||
queryByTestId(document.body, "message").children[1],
|
||||
).toBeEmptyDOMElement(2);
|
||||
|
||||
// Secondary message
|
||||
document.body.innerHTML = renderError(
|
||||
"Something went wrong",
|
||||
"Secondary Message",
|
||||
);
|
||||
expect(
|
||||
queryByTestId(document.body, "message").children[1],
|
||||
).toHaveTextContent(/Secondary Message/gim);
|
||||
});
|
||||
|
||||
it("getCardColors: should return expected values", () => {
|
||||
let colors = getCardColors({
|
||||
title_color: "f00",
|
||||
text_color: "0f0",
|
||||
ring_color: "0000ff",
|
||||
icon_color: "00f",
|
||||
bg_color: "fff",
|
||||
border_color: "fff",
|
||||
theme: "dark",
|
||||
});
|
||||
expect(colors).toStrictEqual({
|
||||
titleColor: "#f00",
|
||||
textColor: "#0f0",
|
||||
iconColor: "#00f",
|
||||
ringColor: "#0000ff",
|
||||
bgColor: "#fff",
|
||||
borderColor: "#fff",
|
||||
});
|
||||
});
|
||||
|
||||
it("getCardColors: should fallback to default colors if color is invalid", () => {
|
||||
let colors = getCardColors({
|
||||
title_color: "invalidcolor",
|
||||
text_color: "0f0",
|
||||
icon_color: "00f",
|
||||
bg_color: "fff",
|
||||
border_color: "invalidColor",
|
||||
theme: "dark",
|
||||
});
|
||||
expect(colors).toStrictEqual({
|
||||
titleColor: "#2f80ed",
|
||||
textColor: "#0f0",
|
||||
iconColor: "#00f",
|
||||
ringColor: "#2f80ed",
|
||||
bgColor: "#fff",
|
||||
borderColor: "#e4e2e2",
|
||||
});
|
||||
});
|
||||
|
||||
it("getCardColors: should fallback to specified theme colors if is not defined", () => {
|
||||
let colors = getCardColors({
|
||||
theme: "dark",
|
||||
});
|
||||
expect(colors).toStrictEqual({
|
||||
titleColor: "#fff",
|
||||
textColor: "#9f9f9f",
|
||||
ringColor: "#fff",
|
||||
iconColor: "#79ff97",
|
||||
bgColor: "#151515",
|
||||
borderColor: "#e4e2e2",
|
||||
});
|
||||
});
|
||||
|
||||
it("getCardColors: should return ring color equal to title color if not ring color is defined", () => {
|
||||
let colors = getCardColors({
|
||||
title_color: "f00",
|
||||
text_color: "0f0",
|
||||
icon_color: "00f",
|
||||
bg_color: "fff",
|
||||
border_color: "fff",
|
||||
theme: "dark",
|
||||
});
|
||||
expect(colors).toStrictEqual({
|
||||
titleColor: "#f00",
|
||||
textColor: "#0f0",
|
||||
iconColor: "#00f",
|
||||
ringColor: "#f00",
|
||||
bgColor: "#fff",
|
||||
borderColor: "#fff",
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("wrapTextMultiline", () => {
|
||||
it("should not wrap small texts", () => {
|
||||
{
|
||||
let multiLineText = wrapTextMultiline("Small text should not wrap");
|
||||
expect(multiLineText).toEqual(["Small text should not wrap"]);
|
||||
}
|
||||
});
|
||||
it("should wrap large texts", () => {
|
||||
let multiLineText = wrapTextMultiline(
|
||||
"Hello world long long long text",
|
||||
20,
|
||||
3,
|
||||
);
|
||||
expect(multiLineText).toEqual(["Hello world long", "long long text"]);
|
||||
});
|
||||
it("should wrap large texts and limit max lines", () => {
|
||||
let multiLineText = wrapTextMultiline(
|
||||
"Hello world long long long text",
|
||||
10,
|
||||
2,
|
||||
);
|
||||
expect(multiLineText).toEqual(["Hello", "world long..."]);
|
||||
});
|
||||
it("should wrap chinese by punctuation", () => {
|
||||
let multiLineText = wrapTextMultiline(
|
||||
"专门为刚开始刷题的同学准备的算法基地，没有最细只有更细，立志用动画将晦涩难懂的算法说的通俗易懂！",
|
||||
);
|
||||
expect(multiLineText.length).toEqual(3);
|
||||
expect(multiLineText[0].length).toEqual(18 * 8); // &#xxxxx; x 8
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,123 @@
|
||||
import { jest } from "@jest/globals";
|
||||
import "@testing-library/jest-dom";
|
||||
import axios from "axios";
|
||||
import MockAdapter from "axios-mock-adapter";
|
||||
import wakatime from "../api/wakatime.js";
|
||||
import { renderWakatimeCard } from "../src/cards/wakatime-card.js";
|
||||
import { expect, it, describe, afterEach } from "@jest/globals";
|
||||
|
||||
const wakaTimeData = {
|
||||
data: {
|
||||
categories: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "Coding",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
daily_average: 16095,
|
||||
daily_average_including_other_language: 16329,
|
||||
days_including_holidays: 7,
|
||||
days_minus_holidays: 5,
|
||||
editors: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "VS Code",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
holidays: 2,
|
||||
human_readable_daily_average: "4 hrs 28 mins",
|
||||
human_readable_daily_average_including_other_language: "4 hrs 32 mins",
|
||||
human_readable_total: "22 hrs 21 mins",
|
||||
human_readable_total_including_other_language: "22 hrs 40 mins",
|
||||
id: "random hash",
|
||||
is_already_updating: false,
|
||||
is_coding_activity_visible: true,
|
||||
is_including_today: false,
|
||||
is_other_usage_visible: true,
|
||||
is_stuck: false,
|
||||
is_up_to_date: true,
|
||||
languages: [
|
||||
{
|
||||
digital: "0:19",
|
||||
hours: 0,
|
||||
minutes: 19,
|
||||
name: "Other",
|
||||
percent: 1.43,
|
||||
text: "19 mins",
|
||||
total_seconds: 1170.434361,
|
||||
},
|
||||
{
|
||||
digital: "0:01",
|
||||
hours: 0,
|
||||
minutes: 1,
|
||||
name: "TypeScript",
|
||||
percent: 0.1,
|
||||
text: "1 min",
|
||||
total_seconds: 83.293809,
|
||||
},
|
||||
{
|
||||
digital: "0:00",
|
||||
hours: 0,
|
||||
minutes: 0,
|
||||
name: "YAML",
|
||||
percent: 0.07,
|
||||
text: "0 secs",
|
||||
total_seconds: 54.975151,
|
||||
},
|
||||
],
|
||||
operating_systems: [
|
||||
{
|
||||
digital: "22:40",
|
||||
hours: 22,
|
||||
minutes: 40,
|
||||
name: "Mac",
|
||||
percent: 100,
|
||||
text: "22 hrs 40 mins",
|
||||
total_seconds: 81643.570077,
|
||||
},
|
||||
],
|
||||
percent_calculated: 100,
|
||||
range: "last_7_days",
|
||||
status: "ok",
|
||||
timeout: 15,
|
||||
total_seconds: 80473.135716,
|
||||
total_seconds_including_other_language: 81643.570077,
|
||||
user_id: "random hash",
|
||||
username: "anuraghazra",
|
||||
writes_only: false,
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MockAdapter(axios);
|
||||
|
||||
afterEach(() => {
|
||||
mock.reset();
|
||||
});
|
||||
|
||||
describe("Test /api/wakatime", () => {
|
||||
it("should test the request", async () => {
|
||||
const username = "anuraghazra";
|
||||
const req = { query: { username } };
|
||||
const res = { setHeader: jest.fn(), send: jest.fn() };
|
||||
mock
|
||||
.onGet(
|
||||
`https://wakatime.com/api/v1/users/${username}/stats?is_including_today=true`,
|
||||
)
|
||||
.reply(200, wakaTimeData);
|
||||
|
||||
await wakatime(req, res);
|
||||
|
||||
expect(res.setHeader).toBeCalledWith("Content-Type", "image/svg+xml");
|
||||
expect(res.send).toBeCalledWith(renderWakatimeCard(wakaTimeData.data, {}));
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user