-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add test * Add assert * Add invalid input test * Add test * Fix async act with new react version * act seems not necessary after upgrading react * Rename file * Remove testing on node 10 * Upgrade storybook * Remove unused script
- Loading branch information
1 parent
29dd9c1
commit d547ea2
Showing
10 changed files
with
5,939 additions
and
7,886 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -6,8 +6,8 @@ cache: | |
notifications: | ||
email: false | ||
node_js: | ||
- "14" | ||
- "12" | ||
- "10" | ||
script: | ||
- yarn verify | ||
after_success: | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
55 changes: 55 additions & 0 deletions
55
packages/react-property-selectors/src/__tests__/amount/amount-input-box-test-component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,55 @@ | ||
import React, { useCallback, useState } from "react"; | ||
import { Amount, Unit } from "uom"; | ||
import { getDefaultAmountInputBoxStyle, useAmountInputBox } from "../../amount"; | ||
|
||
interface State { | ||
readonly value: Amount.Amount<unknown>; | ||
} | ||
|
||
export function AmountInputBoxTestComponent({ | ||
onValueChange, | ||
}: { | ||
readonly onValueChange: (a: Amount.Amount<unknown>) => void; | ||
}): React.ReactElement<{}> { | ||
const value: Amount.Amount<unknown> | undefined = Amount.create(10, Unit.One); | ||
|
||
const [state, setState] = useState<State>({ | ||
value, | ||
}); | ||
|
||
const onValueChangeInternal = useCallback( | ||
(v) => { | ||
setState({ | ||
...state, | ||
value: v, | ||
}); | ||
onValueChange(v); | ||
}, | ||
[state, setState] | ||
); | ||
|
||
const amountInputBox = useAmountInputBox({ | ||
value: state.value, | ||
inputUnit: Unit.One, | ||
inputDecimalCount: 2, | ||
notNumericMessage: "notNumericMessage", | ||
isRequiredMessage: "isRequiredMessage", | ||
readOnly: false, | ||
debounceTime: 100, | ||
errorMessage: "", | ||
onValueChange: onValueChangeInternal, | ||
}); | ||
|
||
return ( | ||
<div> | ||
<div>AmountInputBox:</div> | ||
<div>Value: {Amount.toString(state.value)}</div> | ||
<input | ||
data-testid="input" | ||
type="text" | ||
{...amountInputBox.getInputProps()} | ||
style={getDefaultAmountInputBoxStyle(amountInputBox)} | ||
/> | ||
</div> | ||
); | ||
} |
38 changes: 38 additions & 0 deletions
38
packages/react-property-selectors/src/__tests__/amount/amount-input-box.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
import React from "react"; | ||
import { Amount, Unit } from "uom"; | ||
import { render, screen, waitFor } from "@testing-library/react"; | ||
import userEvent from "@testing-library/user-event"; | ||
import { AmountInputBoxTestComponent } from "./amount-input-box-test-component"; | ||
|
||
describe("Test <AmountInputBoxTestComponent />", () => { | ||
it("should call onValueChange after typing a valid value", async () => { | ||
const onValueChange = jest.fn(); | ||
render(<AmountInputBoxTestComponent onValueChange={onValueChange} />); | ||
const input = screen.getByTestId("input"); | ||
userEvent.type(input, "1"); | ||
expect(input).toHaveValue("101"); | ||
const a = Amount.create(101, Unit.One); | ||
expect(onValueChange).not.toHaveBeenCalled(); // It won't be called immediately | ||
await waitFor(() => expect(onValueChange).toHaveBeenCalledWith(a), { timeout: 100 }); // But will get called within 100ms | ||
}); | ||
|
||
it("should not call onValueChange after typing a invalid value", async () => { | ||
const onValueChange = jest.fn(); | ||
render(<AmountInputBoxTestComponent onValueChange={onValueChange} />); | ||
const input = screen.getByTestId("input"); | ||
userEvent.type(input, "A"); | ||
expect(input).toHaveValue("10A"); | ||
await waitFor(() => expect(onValueChange).not.toHaveBeenCalled(), { timeout: 100 }); | ||
}); | ||
|
||
it("should not call onValueChange after changing an invalid value back to valid", async () => { | ||
const onValueChange = jest.fn(); | ||
render(<AmountInputBoxTestComponent onValueChange={onValueChange} />); | ||
const input = screen.getByTestId("input"); | ||
userEvent.type(input, "A{backspace}1"); | ||
expect(input).toHaveValue("101"); | ||
const a = Amount.create(101, Unit.One); | ||
expect(onValueChange).not.toHaveBeenCalled(); // It won't be called immediately | ||
await waitFor(() => expect(onValueChange).toHaveBeenCalledWith(a), { timeout: 100 }); | ||
}); | ||
}); |
2 changes: 2 additions & 0 deletions
2
packages/react-property-selectors/src/__tests__/jest-setup.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
/* eslint-disable */ | ||
import "@testing-library/jest-dom"; |
Oops, something went wrong.