mirror of
https://github.com/tiennm99/github-readme-stats.git
synced 2026-09-03 18:16:43 +00:00
fix: firefox text overflow issue (#1492)
* Fixed Firefox text overflow / overwriting issue Tests currently don't work becouse it appears that '@supports' is not supported by cssToObject used within the tests. I currently have no idea how to fix that test but the cards themself appear to not be broken Fixes anuraghazra/github-readme-stats#664 Fixes anuraghazra/github-readme-stats#1134 * Fixed tests by moving to other css-to-object Moved the `css-to-object` package to @uppercod's version for test fix. This doesn't seem to have the same issues as the older package * chore: cleanup test Co-authored-by: Anurag <hazru.anurag@gmail.com>
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
require("@testing-library/jest-dom");
|
||||
const cssToObject = require("css-to-object");
|
||||
const cssToObject = require("@uppercod/css-to-object").cssToObject;
|
||||
const renderRepoCard = require("../src/cards/repo-card");
|
||||
|
||||
const { queryByTestId } = require("@testing-library/dom");
|
||||
@@ -130,13 +130,13 @@ describe("Test renderRepoCard", () => {
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[".header"];
|
||||
const descClassStyles = stylesObject[".description"];
|
||||
const iconClassStyles = stylesObject[".icon"];
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill).toBe("#2f80ed");
|
||||
expect(descClassStyles.fill).toBe("#333");
|
||||
expect(iconClassStyles.fill).toBe("#586069");
|
||||
expect(headerClassStyles.fill.trim()).toBe("#2f80ed");
|
||||
expect(descClassStyles.fill.trim()).toBe("#333");
|
||||
expect(iconClassStyles.fill.trim()).toBe("#586069");
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
"#fffefe",
|
||||
@@ -158,13 +158,13 @@ describe("Test renderRepoCard", () => {
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[".header"];
|
||||
const descClassStyles = stylesObject[".description"];
|
||||
const iconClassStyles = stylesObject[".icon"];
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill).toBe(`#${customColors.title_color}`);
|
||||
expect(descClassStyles.fill).toBe(`#${customColors.text_color}`);
|
||||
expect(iconClassStyles.fill).toBe(`#${customColors.icon_color}`);
|
||||
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",
|
||||
@@ -180,13 +180,15 @@ describe("Test renderRepoCard", () => {
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[".header"];
|
||||
const descClassStyles = stylesObject[".description"];
|
||||
const iconClassStyles = stylesObject[".icon"];
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill).toBe(`#${themes[name].title_color}`);
|
||||
expect(descClassStyles.fill).toBe(`#${themes[name].text_color}`);
|
||||
expect(iconClassStyles.fill).toBe(`#${themes[name].icon_color}`);
|
||||
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}`);
|
||||
expect(queryByTestId(document.body, "card-bg")).toHaveAttribute(
|
||||
"fill",
|
||||
`#${themes[name].bg_color}`,
|
||||
@@ -203,13 +205,13 @@ describe("Test renderRepoCard", () => {
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[".header"];
|
||||
const descClassStyles = stylesObject[".description"];
|
||||
const iconClassStyles = stylesObject[".icon"];
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill).toBe("#5a0");
|
||||
expect(descClassStyles.fill).toBe(`#${themes.radical.text_color}`);
|
||||
expect(iconClassStyles.fill).toBe(`#${themes.radical.icon_color}`);
|
||||
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}`,
|
||||
@@ -226,13 +228,15 @@ describe("Test renderRepoCard", () => {
|
||||
const styleTag = document.querySelector("style");
|
||||
const stylesObject = cssToObject(styleTag.innerHTML);
|
||||
|
||||
const headerClassStyles = stylesObject[".header"];
|
||||
const descClassStyles = stylesObject[".description"];
|
||||
const iconClassStyles = stylesObject[".icon"];
|
||||
const headerClassStyles = stylesObject[":host"][".header "];
|
||||
const descClassStyles = stylesObject[":host"][".description "];
|
||||
const iconClassStyles = stylesObject[":host"][".icon "];
|
||||
|
||||
expect(headerClassStyles.fill).toBe(`#${themes.default.title_color}`);
|
||||
expect(descClassStyles.fill).toBe(`#${themes.default.text_color}`);
|
||||
expect(iconClassStyles.fill).toBe(`#${themes.radical.icon_color}`);
|
||||
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}`,
|
||||
|
||||
Reference in New Issue
Block a user