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.

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

Depoluted test logs #229

Merged
merged 2 commits into from
Sep 25, 2023
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,7 @@
"@storybook/builder-webpack5": "^7.0.23",
"@storybook/testing-library": "^0.2.0",
"@storybook/testing-react": "^2.0.1",
"@testing-library/dom": "^9.3.3",
"@testing-library/react": "^14.0.0",
"@types/jsonld": "^1.5.1",
"chromatic": "^6.5.3",
Expand Down
2 changes: 1 addition & 1 deletion src/components/answer/TypeaheadAnswer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -131,7 +131,7 @@ const TypeaheadAnswer = (props) => {
TypeaheadAnswer.propTypes = {
question: PropTypes.object.isRequired,
answer: PropTypes.object.isRequired,
label: PropTypes.object.isRequired,
label: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,
title: PropTypes.string,
value: PropTypes.string,
onChange: PropTypes.func.isRequired,
Expand Down
2 changes: 1 addition & 1 deletion src/components/comment/CommentView.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ const CommentView = (props) => {
};

CommentView.propTypes = {
author: PropTypes.object.isRequired,
author: PropTypes.object,
timestamp: PropTypes.string.isRequired,
commentValue: PropTypes.string.isRequired,
onDeleteQuestionComment: PropTypes.func.isRequired,
Expand Down
2 changes: 1 addition & 1 deletion src/stories/QuestionCommentIcon.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const Template: ComponentStory<typeof QuestionCommentIcon> = (
return (
<ConfigurationContextProvider options={options}>
<IntlContextProvider locale={locale}>
<QuestionCommentIcon {...args} />
<QuestionCommentIcon {...args} onChange={() => void undefined} />
</IntlContextProvider>
</ConfigurationContextProvider>
);
Expand Down
94 changes: 78 additions & 16 deletions test/__tests__/Answer.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,12 @@ describe("Answer component", () => {
}}
>
<FormGenContext.Provider value={{ getOptions, loadFormOptions }}>
<Answer answer={{}} question={question} onChange={onChange} />
<Answer
answer={{}}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</FormGenContext.Provider>
</ConfigurationContext.Provider>
);
Expand Down Expand Up @@ -104,12 +109,17 @@ describe("Answer component", () => {
<FormGenContext.Provider
value={{ getOptions, loadFormOptions: () => typeAheadOptions }}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</FormGenContext.Provider>
</ConfigurationContext.Provider>
);

await waitFor(async () => {
await waitFor(() => {
const typeahead = screen.getByRole("combobox");

fireEvent.click(typeahead);
Expand All @@ -120,7 +130,7 @@ describe("Answer component", () => {
});
});

it("loads typeahead options when layout class is typeahead and no possible values are specified", () => {
it("loads typeahead options when layout class is typeahead and no possible values are specified", async () => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why this?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From react documentation, a component must be prepared for assertion using act(). It is usually already integrated in React-testing librabry, but in case of asynchronous updates, it must be wrapped in waitFor()

question[Constants.LAYOUT_CLASS].push(Constants.LAYOUT.QUESTION_TYPEAHEAD);
const query = "SELECT * WHERE { ?x ?y ?z .}";
question[Constants.HAS_OPTIONS_QUERY] = query;
Expand All @@ -134,13 +144,20 @@ describe("Answer component", () => {
}}
>
<FormGenContext.Provider value={{ getOptions, loadFormOptions }}>
<Answer answer={{}} question={question} onChange={onChange} />
<Answer
answer={{}}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</FormGenContext.Provider>
</ConfigurationContext.Provider>
);

expect(loadFormOptions).toHaveBeenCalled();
expect(loadFormOptions.mock.calls[0][1]).toEqual(query);
await waitFor(() => {
expect(loadFormOptions).toHaveBeenCalled();
expect(loadFormOptions.mock.calls[0][1]).toEqual(query);
});
});

function answerWithCodeValue(value) {
Expand All @@ -166,7 +183,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />s
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand Down Expand Up @@ -204,7 +226,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand All @@ -231,7 +258,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand All @@ -258,7 +290,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand Down Expand Up @@ -289,7 +326,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand Down Expand Up @@ -319,7 +361,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = screen.getByRole("checkbox");
Expand All @@ -345,7 +392,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);

Expand Down Expand Up @@ -373,7 +425,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = screen.getByRole("textbox");
Expand Down Expand Up @@ -401,7 +458,12 @@ describe("Answer component", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = screen.getByRole("textbox");
Expand Down
42 changes: 36 additions & 6 deletions test/__tests__/InputAnswer.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand All @@ -84,7 +89,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand All @@ -108,7 +118,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand All @@ -132,7 +147,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand All @@ -158,7 +178,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand All @@ -181,7 +206,12 @@ describe("InputAnswer", () => {
options,
}}
>
<Answer question={question} answer={answer} onChange={onChange} />
<Answer
question={question}
answer={answer}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand Down
14 changes: 12 additions & 2 deletions test/__tests__/MaskedInputAnswer.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,12 @@ describe("MaskedInputAnswer", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand Down Expand Up @@ -79,7 +84,12 @@ describe("MaskedInputAnswer", () => {
options,
}}
>
<Answer answer={answer} question={question} onChange={onChange} />
<Answer
answer={answer}
question={question}
onChange={onChange}
onCommentChange={() => void undefined}
/>
</ConfigurationContext.Provider>
);
const input = component.find("input");
Expand Down
Loading
Loading