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

Increase Playwright timeouts, robustify YAML editor interaction #422

Merged
merged 3 commits into from
Sep 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
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
3 changes: 2 additions & 1 deletion src/features/yamlEditor/components/editor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ export const CodeEditor = ({ code, onChangeEditor }: ICodeEditor) => {
const convertToJSON = (e: string) => {
try {
setIsError(false);
onChangeEditor(parse(e));
onChangeEditor(parse(e) || {});
Copy link
Contributor Author

Choose a reason for hiding this comment

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

This is a lazy fix to prevent a runtime error that occurs if you clear the YAML editor. But a more rigorous fix would take a lot more time because the editor right now just doesn't have good validation.

} catch (e) {
setIsError(true);
}
Expand All @@ -52,6 +52,7 @@ export const CodeEditor = ({ code, onChangeEditor }: ICodeEditor) => {
theme={isGrayscaleStyleType ? undefined : greenAccentTheme}
extensions={[StreamLanguage.define(yamlLanguage)]}
onChange={e => convertToJSON(e)}
data-testid="yaml-editor"
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Should have done this a long time ago since it allows us to avoid the text matching (page.get_by_text) that you can find in the diff on the left in the Playwright test file. But I wonder if this test id data attribute should be "yaml-editor-container" or maybe "code-mirror-container" because, as you might notice in the changes to the Playwright test file in this PR, the locator for the actual textbox field looks like this:

page.get_by_test_id("yaml-editor").get_by_role("textbox")

That's because the HTML structure of the CodeMirror React component is like this:

<div data-testid="yaml-editor">
  <!-- stuff -->
  <div contenteditable>
  <!-- more stuff -->

/>

<Box
Expand Down
19 changes: 12 additions & 7 deletions test/playwright/test_ux.py
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
import random


DEFAULT_TIMEOUT = 30_000 # time in ms
DEFAULT_TIMEOUT = 60_000 # time in ms
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I increased this value because I saw "Timeout 30000ms exceeded" in the GitHub Action logs


expect.set_options(timeout=DEFAULT_TIMEOUT)

Expand Down Expand Up @@ -120,7 +120,7 @@ def _create_new_environment(page, screenshot=False):


def _existing_environment_interactions(
page, env_name, time_to_build_env=3 * 60 * 1000, screenshot=False
page, env_name, time_to_build_env=5 * 60 * 1000, screenshot=False
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I increased this value because I also saw "Timeout 180000ms exceeded" in the GitHub Action logs

):
"""test interactions with existing environments.
During this test, the test will be rebuilt twice.
Expand All @@ -145,18 +145,23 @@ def _existing_environment_interactions(
env_link = page.get_by_role("link", name=env_name)
edit_button = page.get_by_role("button", name="Edit")

# edit existing environment throught the YAML editor
# edit existing environment through the YAML editor
env_link.click()
edit_button.click()
page.get_by_label("YAML").check()
if screenshot:
page.screenshot(path="test-results/conda-store-yaml-editor.png")
page.get_by_text("- rich").click()
page.get_by_text(
"channels: - conda-forgedependencies: - rich - pip: - nothing - ipykernel"
).fill(

# set the YAML editor to a particular environment specification
yaml_editor = page.get_by_test_id("yaml-editor").get_by_role("textbox")
# note: I'm not sure this is necessary but I deliberately chose to match
# text near the end of the editor to prevent the possibility of Playwright
# acting on the editor before it has finished rendering its initial value
yaml_editor.filter(has_text=r"variables: {}").clear()
yaml_editor.fill(
"channels:\n - conda-forge\ndependencies:\n - rich\n - python\n - pip:\n - nothing\n - ipykernel\n\n"
)

page.get_by_role("button", name="Save").click()
edit_button.wait_for(state="attached")

Expand Down