{
describe("sizeDefaults", () => {
@@ -18,21 +13,23 @@ describe("Default Props functions for different loaders", () => {
});
it("should return an object containing the common props: loading, color, css", () => {
- let defaultProps: Required = sizeDefaults(1);
+ let defaultProps: DefaultProps = sizeDefaults(1);
expect(defaultProps).toHaveProperty("loading");
expect(defaultProps.loading).toEqual(true);
expect(defaultProps).toHaveProperty("color");
expect(defaultProps.color).toEqual("#000000");
expect(defaultProps).toHaveProperty("css");
- expect(defaultProps.css).toEqual("");
+ expect(defaultProps.css).toEqual({});
});
it("should return the size as the passed in size value", () => {
- let defaultProps1: Required = sizeDefaults(1);
+ let defaultProps1: DefaultProps = sizeDefaults(1);
expect(defaultProps1).toHaveProperty("size");
expect(defaultProps1.size).toEqual(1);
+ expect(defaultProps1).toHaveProperty("sizeUnit");
+ expect(defaultProps1.sizeUnit).toEqual("px");
- let defaultProps2: Required = sizeDefaults(2);
+ let defaultProps2: DefaultProps = sizeDefaults(2);
expect(defaultProps2).toHaveProperty("size");
expect(defaultProps2.size).toEqual(2);
});
@@ -44,23 +41,25 @@ describe("Default Props functions for different loaders", () => {
});
it("should return an object containing the common props: loading, color, css", () => {
- let defaultProps: Required = sizeMarginDefaults(1);
+ let defaultProps: DefaultProps = sizeMarginDefaults(1);
expect(defaultProps).toHaveProperty("loading");
expect(defaultProps.loading).toEqual(true);
expect(defaultProps).toHaveProperty("color");
expect(defaultProps.color).toEqual("#000000");
expect(defaultProps).toHaveProperty("css");
- expect(defaultProps.css).toEqual("");
+ expect(defaultProps.css).toEqual({});
});
it("should return the size as the passed in size value", () => {
- let defaultProps1: Required = sizeMarginDefaults(1);
+ let defaultProps1: DefaultProps = sizeMarginDefaults(1);
expect(defaultProps1).toHaveProperty("size");
expect(defaultProps1.size).toEqual(1);
+ expect(defaultProps1).toHaveProperty("sizeUnit");
+ expect(defaultProps1.sizeUnit).toEqual("px");
expect(defaultProps1).toHaveProperty("margin");
expect(defaultProps1.margin).toEqual("2px");
- let defaultProps2: Required = sizeMarginDefaults(2);
+ let defaultProps2: DefaultProps = sizeMarginDefaults(2);
expect(defaultProps2).toHaveProperty("size");
expect(defaultProps2.size).toEqual(2);
});
@@ -72,23 +71,27 @@ describe("Default Props functions for different loaders", () => {
});
it("should return an object containing the common props: loading, color, css", () => {
- let defaultProps: Required = heightWidthDefaults(1, 1);
+ let defaultProps: DefaultProps = heightWidthDefaults(1, 1);
expect(defaultProps).toHaveProperty("loading");
expect(defaultProps.loading).toEqual(true);
expect(defaultProps).toHaveProperty("color");
expect(defaultProps.color).toEqual("#000000");
expect(defaultProps).toHaveProperty("css");
- expect(defaultProps.css).toEqual("");
+ expect(defaultProps.css).toEqual({});
});
it("should return the height/width as the passed in height/width value", () => {
- let defaultProps1: Required = heightWidthDefaults(1, 2);
+ let defaultProps1: DefaultProps = heightWidthDefaults(1, 2);
expect(defaultProps1).toHaveProperty("height");
expect(defaultProps1.height).toEqual(1);
expect(defaultProps1).toHaveProperty("width");
expect(defaultProps1.width).toEqual(2);
+ expect(defaultProps1).toHaveProperty("heightUnit");
+ expect(defaultProps1.heightUnit).toEqual("px");
+ expect(defaultProps1).toHaveProperty("widthUnit");
+ expect(defaultProps1.widthUnit).toEqual("px");
- let defaultProps2: Required = heightWidthDefaults(3, 4);
+ let defaultProps2: DefaultProps = heightWidthDefaults(3, 4);
expect(defaultProps2).toHaveProperty("height");
expect(defaultProps2.height).toEqual(3);
expect(defaultProps2).toHaveProperty("width");
@@ -102,33 +105,31 @@ describe("Default Props functions for different loaders", () => {
});
it("should return an object containing the common props: loading, color, css", () => {
- let defaultProps: Required = heightWidthRadiusDefaults(1, 1, 1);
+ let defaultProps: DefaultProps = heightWidthRadiusDefaults(1, 1, 1);
expect(defaultProps).toHaveProperty("loading");
expect(defaultProps.loading).toEqual(true);
expect(defaultProps).toHaveProperty("color");
expect(defaultProps.color).toEqual("#000000");
expect(defaultProps).toHaveProperty("css");
- expect(defaultProps.css).toEqual("");
+ expect(defaultProps.css).toEqual({});
});
it("should return the height/width as the passed in height/width value", () => {
- let defaultProps1: Required = heightWidthRadiusDefaults(
- 1,
- 2,
- 3
- );
+ let defaultProps1: DefaultProps = heightWidthRadiusDefaults(1, 2, 3);
expect(defaultProps1).toHaveProperty("height");
expect(defaultProps1.height).toEqual(1);
expect(defaultProps1).toHaveProperty("width");
expect(defaultProps1.width).toEqual(2);
expect(defaultProps1).toHaveProperty("radius");
expect(defaultProps1.radius).toEqual(3);
-
- let defaultProps2: Required = heightWidthRadiusDefaults(
- 4,
- 5,
- 6
- );
+ expect(defaultProps1).toHaveProperty("heightUnit");
+ expect(defaultProps1.heightUnit).toEqual("px");
+ expect(defaultProps1).toHaveProperty("widthUnit");
+ expect(defaultProps1.widthUnit).toEqual("px");
+ expect(defaultProps1).toHaveProperty("radiusUnit");
+ expect(defaultProps1.widthUnit).toEqual("px");
+
+ let defaultProps2: DefaultProps = heightWidthRadiusDefaults(4, 5, 6);
expect(defaultProps2).toHaveProperty("height");
expect(defaultProps2.height).toEqual(4);
expect(defaultProps2).toHaveProperty("width");
@@ -138,7 +139,7 @@ describe("Default Props functions for different loaders", () => {
});
it("radius value should default to 2", () => {
- let defaultProps: Required = heightWidthRadiusDefaults(5, 6);
+ let defaultProps: DefaultProps = heightWidthRadiusDefaults(5, 6);
expect(defaultProps.radius).toEqual(2);
});
});
diff --git a/__tests__/helpers/unitConverter-tests.ts b/__tests__/helpers/unitConverter-tests.ts
index ce3c7309..932bc8c6 100644
--- a/__tests__/helpers/unitConverter-tests.ts
+++ b/__tests__/helpers/unitConverter-tests.ts
@@ -1,59 +1,38 @@
-import { parseLengthAndUnit, cssValue } from "../../src/helpers";
+import { unitConverter } from "../../src/helpers";
import { LengthObject } from "../../src/interfaces";
describe("unitConverter", () => {
- describe("parseLengthAndUnit", () => {
- let spy: jest.SpyInstance = jest.spyOn(console, "warn");
- let output: LengthObject = {
- value: 12,
- unit: "px"
- };
-
- it("is a function", () => {
- expect(typeof parseLengthAndUnit).toEqual("function");
- });
-
- it("takes a number as the input and append px to the value", () => {
- expect(parseLengthAndUnit(12)).toEqual(output);
- expect(spy).not.toBeCalled();
- });
-
- it("take a string with valid integer css unit and return an object with value and unit", () => {
- expect(parseLengthAndUnit("12px")).toEqual(output);
- expect(spy).not.toBeCalled();
- });
-
- it("take a string with valid css float unit and return an object with value and unit", () => {
- let output: LengthObject = {
- value: 12.5,
- unit: "px"
- };
- expect(parseLengthAndUnit("12.5px")).toEqual(output);
- expect(spy).not.toBeCalled();
- });
-
- it("takes an invalid css unit and default the value to px", () => {
- expect(parseLengthAndUnit("12fd")).toEqual(output);
- expect(spy).toBeCalled();
- });
+ let spy: jest.SpyInstance = jest.spyOn(console, "warn");
+ let output: LengthObject = {
+ value: 12,
+ unit: "px"
+ };
+
+ it("is a function", () => {
+ expect(typeof unitConverter).toEqual("function");
});
- describe("cssValue", () => {
- it("is a function", () => {
- expect(typeof cssValue).toEqual("function");
- });
+ it("takes a number as the input and append px to the value", () => {
+ expect(unitConverter(12)).toEqual(output);
+ expect(spy).not.toBeCalled();
+ });
- it("takes a number as the input and append px to the value", () => {
- expect(cssValue(12)).toEqual("12px");
- });
+ it("take a string with valid integer css unit and return an object with value and unit", () => {
+ expect(unitConverter("12px")).toEqual(output);
+ expect(spy).not.toBeCalled();
+ });
- it("takes a string with valid css unit as the input and return the value", () => {
- expect(cssValue("12%")).toEqual("12%");
- expect(cssValue("12em")).toEqual("12em");
- });
+ it("take a string with valid css float unit and return an object with value and unit", () => {
+ let output: LengthObject = {
+ value: 12.5,
+ unit: "px"
+ };
+ expect(unitConverter("12.5px")).toEqual(output);
+ expect(spy).not.toBeCalled();
+ });
- it("takes a string with invalid css unit as the input and default to px", () => {
- expect(cssValue("12qw")).toEqual("12px");
- });
+ it("takes an invalid css unit and default the value to px", () => {
+ expect(unitConverter("12fd")).toEqual(output);
+ expect(spy).toBeCalled();
});
});
diff --git a/docs/index.html b/docs/index.html
index 6a107e4b..89e5b1b2 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -37,7 +37,7 @@
ga('send', 'pageview');
-
+
-
-
- {/* {Object.keys(Spinners).map((name: string) => (
+ {Object.keys(Spinners).map((name: string) => (
- ))} */}
+ ))}
);
}
diff --git a/src/BarLoader.tsx b/src/BarLoader.tsx
index d019d4e6..69514d4d 100644
--- a/src/BarLoader.tsx
+++ b/src/BarLoader.tsx
@@ -3,7 +3,7 @@ import * as React from "react";
import { keyframes, css, jsx } from "@emotion/core";
import { Keyframes } from "@emotion/serialize";
-import { calculateRgba, heightWidthDefaults, cssValue } from "./helpers";
+import { calculateRgba, heightWidthDefaults } from "./helpers";
import {
LoaderHeightWidthProps,
StyleFunction,
@@ -27,11 +27,11 @@ export class Loader extends React.PureComponent