Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Revert "unit props deprecation: update proptypes and interfaces + bounceloader" #137

Merged
merged 1 commit into from
Nov 12, 2019
Merged

Revert "unit props deprecation: update proptypes and interfaces + bounceloader" #137

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
85 changes: 26 additions & 59 deletions __tests__/BarLoader-tests.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,69 +46,36 @@ describe("BarLoader", () => {
expect(loader.find("div div")).toHaveStyleRule("background-color", color);
});

describe("height prop", () => {
it("should render the height with px unit when size is a number", () => {
let height: number = 10;
loader = mount(<BarLoader height={height} />);
expect(loader).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${height}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule(
"height",
`${defaultHeight}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("height", `${height}${defaultUnit}`);
});

it("should render the height as is when height is a string with valid css unit", () => {
let height: string = "18%";
loader = mount(<BarLoader height={height} />);
expect(loader).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${height}`);
expect(loader.find("div div")).not.toHaveStyleRule(
"height",
`${defaultHeight}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("height", `${height}`);
});

it("should render the height with default unit of px when the unit is incorrect", () => {
let length: number = 18;
let unit: string = "ad";
let height: string = `${length}${unit}`;
loader = mount(<BarLoader height={height} />);
expect(loader).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${length}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule(
"height",
`${defaultHeight}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("height", `${length}${defaultUnit}`);
});
it("should render the correct height based on props", () => {
let height: number = 10;
loader = mount(<BarLoader height={height} />);
expect(loader).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${height}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${height}${defaultUnit}`);
});

describe("width prop", () => {
it("should render the width with px unit when size is a number", () => {
let width: number = 10;
loader = mount(<BarLoader width={10} />);
expect(loader).not.toHaveStyleRule("width", `${defaultWidth}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${width}${defaultUnit}`);
});
it("should render the correct heightUnit basd on passed in props", () => {
let unit: string = "%";
loader = mount(<BarLoader heightUnit={unit} />);
expect(loader).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${defaultHeight}${unit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultHeight}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${defaultHeight}${unit}`);
});

it("should render the height as is when height is a string with valid css unit", () => {
let width: string = "18%";
loader = mount(<BarLoader width={width} />);
expect(loader).not.toHaveStyleRule("width", `${defaultWidth}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${width}`);
});
it("should render the correct width based on props", () => {
let width: number = 10;
loader = mount(<BarLoader width={10} />);
expect(loader).not.toHaveStyleRule("width", `${defaultWidth}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${width}${defaultUnit}`);
});

it("should render the width with default unit of px when the unit is incorrect", () => {
let length: number = 18;
let unit: string = "ad";
let width: string = `${length}${unit}`;
loader = mount(<BarLoader width={width} />);
expect(loader).not.toHaveStyleRule("width", `${defaultWidth}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${length}${defaultUnit}`);
});
it("should render the correct widthUnit basd on passed in props", () => {
let unit: string = "%";
loader = mount(<BarLoader widthUnit="%" />);
expect(loader).not.toHaveStyleRule("width", `${defaultWidth}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${defaultWidth}${unit}`);
});

it("should render the css override based on props", () => {
Expand Down
80 changes: 19 additions & 61 deletions __tests__/BeatLoader-tests.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ describe("BeatLoader", () => {
let props: LoaderSizeMarginProps;
let defaultColor: string = "#000000";
let defaultSize: number = 15;
let defaultMargin: number = 2;
let defaultUnit: string = "px";

it("should match snapshot", () => {
Expand Down Expand Up @@ -44,69 +43,28 @@ describe("BeatLoader", () => {
expect(loader.find("div div")).toHaveStyleRule("background-color", "#e2e2e2");
});

describe("size prop", () => {
it("should render the size with px unit when size is a number", () => {
let size: number = 18;
loader = mount(<BeatLoader size={18} />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}${defaultUnit}`);
});

it("should render the size as is when size is a string with valid css unit", () => {
let size: string = "18px";
loader = mount(<BeatLoader size={size} />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}`);
});

it("should render the size with default unit of px when the unit is incorrect", () => {
let length: number = 18;
let unit: string = "ad";
let size: string = `${length}${unit}`;
loader = mount(<BeatLoader size={size} />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${length}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${length}${defaultUnit}`);
});
it("should render the correct size based on props", () => {
let size: number = 18;
loader = mount(<BeatLoader size={18} />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}${defaultUnit}`);
});

describe("margin prop", () => {
it("should render the margin with px unit when margin is a number", () => {
let margin: number = 18;
loader = mount(<BeatLoader margin={18} />);
expect(loader.find("div div")).not.toHaveStyleRule(
"margin",
`${defaultMargin}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("margin", `${margin}${defaultUnit}`);
});

it("should render the margin as is when margin is a string with valid css unit", () => {
let margin: string = "18px";
loader = mount(<BeatLoader margin={margin} />);
expect(loader.find("div div")).not.toHaveStyleRule(
"margin",
`${defaultMargin}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("margin", `${margin}`);
});
it("should render the correct heightUnit basd on props", () => {
let unit: string = "%";
loader = mount(<BeatLoader sizeUnit="%" />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${defaultSize}${unit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${defaultSize}${unit}`);
});

it("should render the margin with default unit of px when the unit is incorrect", () => {
let length: number = 18;
let unit: string = "ad";
let margin: string = `${length}${unit}`;
loader = mount(<BeatLoader margin={margin} />);
expect(loader.find("div div")).not.toHaveStyleRule(
"margin",
`${defaultMargin}${defaultUnit}`
);
expect(loader.find("div div")).toHaveStyleRule("margin", `${length}${defaultUnit}`);
});
it("should render the correct margin props based on props", () => {
loader = mount(<BeatLoader margin="4%" />);
expect(loader.find("div div")).not.toHaveStyleRule("margin", "2px");
expect(loader.find("div div")).toHaveStyleRule("margin", "4%");
});

it("should render the css override based on props", () => {
Expand Down
61 changes: 19 additions & 42 deletions __tests__/BounceLoader-tests.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,50 +44,27 @@ describe("BounceLoader", () => {
expect(loader.find("div div")).toHaveStyleRule("background-color", color);
});

describe("size prop", () => {
it("should render the size with px unit when size is a number", () => {
let size: number = 18;
loader = mount(<BounceLoader size={size} />);
expect(loader).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
it("should render the correct size based on props", () => {
let size: number = 18;
loader = mount(<BounceLoader size={size} />);
expect(loader).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);

expect(loader).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}${defaultUnit}`);
});

it("should render the size as is when size is a string with valid css unit", () => {
let size: string = "18px";
loader = mount(<BounceLoader size={size} />);
expect(loader).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);

expect(loader).toHaveStyleRule("height", `${size}`);
expect(loader).toHaveStyleRule("width", `${size}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}`);
});

it("should render the size with default unit of px when the unit is incorrect", () => {
let length: number = 18;
let unit: string = "ad";
let size: string = `${length}${unit}`;
loader = mount(<BounceLoader size={size} />);
expect(loader).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${size}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${size}${defaultUnit}`);
});

expect(loader).toHaveStyleRule("height", `${length}${defaultUnit}`);
expect(loader).toHaveStyleRule("width", `${length}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${length}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${length}${defaultUnit}`);
});
it("should render the correct sizeUnit based on props", () => {
let unit: string = "%";
loader = mount(<BounceLoader sizeUnit={unit} />);
expect(loader.find("div div")).not.toHaveStyleRule("height", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).not.toHaveStyleRule("width", `${defaultSize}${defaultUnit}`);
expect(loader.find("div div")).toHaveStyleRule("height", `${defaultSize}${unit}`);
expect(loader.find("div div")).toHaveStyleRule("width", `${defaultSize}${unit}`);
});

it("should render the css override based on props", () => {
Expand Down
4 changes: 3 additions & 1 deletion __tests__/__snapshots__/BarLoader-tests.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,10 +76,12 @@ exports[`BarLoader should match snapshot 1`] = `

<Loader
color="#000000"
css=""
css={Object {}}
height={4}
heightUnit="px"
loading={true}
width={100}
widthUnit="px"
>
<div
className="emotion-2"
Expand Down
3 changes: 2 additions & 1 deletion __tests__/__snapshots__/BeatLoader-tests.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,10 +61,11 @@ exports[`BeatLoader should match snapshot 1`] = `

<Loader
color="#000000"
css=""
css={Object {}}
loading={true}
margin="2px"
size={15}
sizeUnit="px"
>
<div
className="emotion-3"
Expand Down
3 changes: 2 additions & 1 deletion __tests__/__snapshots__/BounceLoader-tests.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,9 +67,10 @@ exports[`BounceLoader should match snapshot 1`] = `

<Loader
color="#000000"
css=""
css={Object {}}
loading={true}
size={60}
sizeUnit="px"
>
<div
className="emotion-2"
Expand Down
Loading