Skip to content

Commit

Permalink
test: improve meter and range calendar tests (#111)
Browse files Browse the repository at this point in the history
* test: improved meter test coverage & removed redundant code

* test: assert live announcer tests in range calendar
  • Loading branch information
anuraghazra committed Oct 22, 2020
1 parent 90caad1 commit 2ab8185
Show file tree
Hide file tree
Showing 4 changed files with 52 additions and 22 deletions.
32 changes: 32 additions & 0 deletions src/calendar/__tests__/RangeCalendar.test.tsx
@@ -1,4 +1,6 @@
jest.mock("../../utils/LiveAnnouncer");
import * as React from "react";
import { cleanup } from "@testing-library/react";
import { axe, render, press } from "reakit-test-utils";

import {
Expand All @@ -13,6 +15,13 @@ import {
RangeCalendarInitialState,
} from "../index";
import { isEndSelection, isStartSelection } from "../../utils/test-utils";
import { announce, destroyAnnouncer } from "../../utils/LiveAnnouncer";

afterEach(cleanup);

beforeEach(() => {
destroyAnnouncer();
});

const RangeCalendarComp: React.FC<RangeCalendarInitialState> = props => {
const state = useRangeCalendarState(props);
Expand Down Expand Up @@ -105,6 +114,29 @@ describe("RangeCalendar", () => {
expect(end).toHaveTextContent("30");
});

it("should announce selected range after finishing selection", async () => {
const { getByLabelText: label } = render(
<RangeCalendarComp
defaultValue={{ start: "2019-10-07", end: "2019-10-30" }}
/>,
);

press.Tab();
press.Tab();
press.Tab();
press.Tab();
press.Tab();
press.Enter(label(/Monday, October 7, 2019 selected/));
press.ArrowDown();
press.ArrowRight();
press.Enter(label(/Tuesday, October 15, 2019/));

expect(announce).toHaveBeenCalledTimes(2);
expect(announce).toHaveBeenLastCalledWith(
"Selected range, from 7th Oct 2019 to 15th Oct 2019",
);
});

it("should be able to select ranges with keyboard navigation", () => {
const { getByLabelText: label, getByTestId: testId, baseElement } = render(
<RangeCalendarComp
Expand Down
12 changes: 6 additions & 6 deletions src/meter/MeterState.ts
Expand Up @@ -3,8 +3,8 @@ import {
useSealedState,
} from "reakit-utils/useSealedState";

import { isFunction, valueToPercent } from "../utils";
import { getDefaultOptimumValue, calculateStatus, clamp } from "./helpers";
import { isFunction, valueToPercent, clampValue } from "../utils";
import { getDefaultOptimumValue, calculateStatus } from "./helpers";

type Status = "safe" | "caution" | "danger" | undefined;

Expand Down Expand Up @@ -83,10 +83,10 @@ export const useMeterState = (
const initialOptimum =
sealed.optimum ?? getDefaultOptimumValue(initialLow, initialHigh);

const value = clamp(initialValue, min, max);
const optimum = clamp(initialOptimum, min, max);
let low = clamp(initialLow, min, max);
let high = clamp(initialHigh, min, max);
const value = clampValue(initialValue, min, max);
const optimum = clampValue(initialOptimum, min, max);
let low = clampValue(initialLow, min, max);
let high = clampValue(initialHigh, min, max);

// More inequalities handled
// low ≤ high (if both low and high are specified)
Expand Down
14 changes: 14 additions & 0 deletions src/meter/__tests__/Meter.test.tsx
Expand Up @@ -124,4 +124,18 @@ describe("Meter", () => {
},
data,
);

test("useMeterState: low >= high", function () {
const { current } = renderMeterStateHook({ low: 1, high: 0.2 });

expect(current.low).toBe(0.2);
expect(current.high).toBe(0.2);
});

test("useMeterState: high >= low", function () {
const { current } = renderMeterStateHook({ high: 1, low: 0.2 });

expect(current.low).toBe(0.2);
expect(current.high).toBe(1);
});
});
16 changes: 0 additions & 16 deletions src/meter/helpers.ts
Expand Up @@ -8,22 +8,6 @@ export function getDefaultOptimumValue(min: number, max: number) {
return max < min ? min : min + (max - min) / 2;
}

/**
* Handle Inequalities with received values
*
* minimum ≤ value ≤ maximum
* minimum ≤ low ≤ maximum (if low is specified)
* minimum ≤ high ≤ maximum (if high is specified)
* minimum ≤ optimum ≤ maximum (if optimum is specified)
*
* @see https://html.spec.whatwg.org/multipage/form-elements.html#the-meter-element:attr-meter-max-3:~:text=following%20inequalities%20must%20hold
*/
export function clamp(value: number, min: number, max: number) {
if (value == null) return 0;

return Math.min(Math.max(value, min), max);
}

type CalculateStatusProps = {
value: number;
optimum: number;
Expand Down

0 comments on commit 2ab8185

Please sign in to comment.