Skip to content

Commit

Permalink
add selenium test for snapping
Browse files Browse the repository at this point in the history
  • Loading branch information
ElectronicBlueberry committed Sep 25, 2023
1 parent 3009fcb commit 748f747
Show file tree
Hide file tree
Showing 4 changed files with 103 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,14 @@ function onClickColour(colour: WorkflowCommentColour) {
<button
class="colour-button prevent-zoom"
title="No Colour"
data-colour="none"
:class="{ selected: props.colour === 'none' }"
@click="() => onClickColour('none')"></button>
<button
v-for="(hex, name) in colours"
:key="name"
class="colour-button prevent-zoom"
:data-colour="name"
:title="`Colour ${name}`"
:class="{ selected: props.colour === name }"
:style="{
Expand Down
34 changes: 30 additions & 4 deletions client/src/components/Workflow/Editor/Tools/ToolBar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
class="button"
data-tool="pointer"
title="Pointer Tool (Ctrl + 1)"
:pressed="currentTool === 'pointer'"
variant="outline-primary"
Expand All @@ -121,6 +122,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
class="button"
data-tool="toggle_snap"
:title="snapButtonTitle"
:pressed.sync="snapActive"
variant="outline-primary">
Expand All @@ -132,6 +134,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
class="button font-weight-bold"
data-tool="text_comment"
title="Text comment (Ctrl + 3)"
:pressed="currentTool === 'textComment'"
variant="outline-primary"
Expand All @@ -141,6 +144,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
class="button"
data-tool="markdown_comment"
title="Markdown comment (Ctrl + 4)"
:pressed="currentTool === 'markdownComment'"
variant="outline-primary"
Expand All @@ -150,6 +154,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
class="button"
data-tool="frame_comment"
title="Frame comment (Ctrl + 5)"
:pressed="currentTool === 'frameComment'"
variant="outline-primary"
Expand All @@ -162,6 +167,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
title="Freehand Pen (Ctrl + 6)"
data-tool="freehand_pen"
:pressed="currentTool === 'freehandComment'"
class="button"
variant="outline-primary"
Expand All @@ -171,6 +177,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
v-b-tooltip.hover.noninteractive.right
title="Freehand Eraser (Ctrl + 7)"
data-tool="freehand_eraser"
:pressed="currentTool === 'freehandEraser'"
class="button"
variant="outline-primary"
Expand All @@ -192,6 +199,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BFormInput
:id="snappingDistanceId"
v-model="snappingDistanceRangeValue"
data-option="snapping-distance"
type="range"
min="1"
max="5"
Expand All @@ -203,10 +211,15 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BButton
:pressed.sync="commentOptions.bold"
variant="outline-primary"
class="button font-weight-bold">
class="button font-weight-bold"
data-option="toggle-bold">
Bold
</BButton>
<BButton :pressed.sync="commentOptions.italic" variant="outline-primary" class="button font-italic">
<BButton
:pressed.sync="commentOptions.italic"
variant="outline-primary"
class="button font-italic"
data-option="toggle-italic">
Italic
</BButton>
</BButtonGroup>
Expand All @@ -224,7 +237,14 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<span class="font-weight-bold">Text Size</span>
{{ commentOptions.textSize }}00%
</label>
<BFormInput :id="fontSizeId" v-model="fontSize" type="range" min="1" max="5" step="1" />
<BFormInput
:id="fontSizeId"
v-model="fontSize"
data-option="font-size"
type="range"
min="1"
max="5"
step="1" />
</div>

<div v-if="toolbarStore.currentTool === 'freehandComment'" class="option small">
Expand All @@ -235,6 +255,7 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BFormInput
:id="thicknessId"
v-model="commentOptions.lineThickness"
data-option="line-thickness"
type="range"
min="4"
max="20"
Expand All @@ -249,14 +270,19 @@ whenever(ctrl_7!, () => (toolbarStore.currentTool = "freehandEraser"));
<BFormInput
:id="smoothingId"
v-model="commentOptions.smoothing"
data-option="smoothing"
type="range"
min="1"
max="10"
step="1" />
</div>

<div v-if="['freehandComment', 'freehandEraser'].includes(toolbarStore.currentTool)" class="option buttons">
<BButton class="button" title="Remove all freehand comments" @click="onRemoveAllFreehand">
<BButton
class="button"
data-option="remove-freehand"
title="Remove all freehand comments"
@click="onRemoveAllFreehand">
Remove all
</BButton>
</div>
Expand Down
23 changes: 23 additions & 0 deletions client/src/utils/navigation/navigation.yml
Original file line number Diff line number Diff line change
Expand Up @@ -677,6 +677,29 @@ workflow_editor:
connector_destroy_callout: "${_} [input-name='${name}'] + .delete-terminal-button"
workflow_output_toggle: "${_} [data-output-name='${name}'] .callout-terminal "
workflow_output_toggle_active: "${_} [data-output-name='${name}'] .mark-terminal-active"
tool_bar:
selectors:
_: ".workflow-editor-toolbar"
tool: "[data-tool='${tool}']"
tool_active: ".active[data-tool='${tool}']"
snapping_distance: "[data-option='snapping-distance']"
toggle_bold: "[data-option='toggle-bold']"
toggle_italic: "[data-option='toggle-italic']"
colour: ".colour-selector [data-colour='${colour}']"
font_size: "[data-option='font-size']"
line_thickness: "[data-option='line-thickness']"
smoothing: "[data-option='smoothing']"
remove_freehand: "[data-option='remove-freehand']"
comment:
selectors:
_: ".workflow-editor-comment"
text: ".text-workflow-comment"
markdown: ".markdown-workflow-comment"
markdown_rendered: ".markdown-workflow-comment .rendered-markdown"
frame: ".frame-workflow-comment"
frame_title: ".frame-workflow-comment .frame-comment-header"
freehand: ".freehand-workflow-comment"
freehand_path: ".freehand-workflow-comment path"
selectors:
canvas_body: '#workflow-canvas'
edit_annotation: '#workflow-annotation'
Expand Down
48 changes: 48 additions & 0 deletions lib/galaxy_test/selenium/test_workflow_editor.py
Original file line number Diff line number Diff line change
Expand Up @@ -1076,6 +1076,54 @@ def test_map_over_output_indicator(self):
self.workflow_editor_destroy_connection("filter#how|filter_source")
self.assert_node_output_is("filter#output_filtered", "list")

@selenium_test
def test_editor_snapping(self):
editor = self.components.workflow_editor
self.workflow_create_new(annotation="simple workflow")
self.sleep_for(self.wait_types.UX_RENDER)

editor.tool_menu.wait_for_visible()

self.tool_open("cat")
self.sleep_for(self.wait_types.UX_RENDER)
editor.label_input.wait_for_and_send_keys("tool_node")

# activate snapping and set it to max (200)
editor.tool_bar.tool(tool="toggle_snap").wait_for_and_click()
editor.tool_bar.snapping_distance.wait_for_and_click()
self.action_chains().send_keys(Keys.RIGHT * 10).perform()

# move the node a bit
tool_node = editor.node._(label="tool_node").wait_for_present()
self.action_chains().move_to_element(tool_node).click_and_hold().move_by_offset(12, 3).release().perform()

# check if editor position is snapped
top, left = self.get_node_position("tool_node")

assert top % 200 == 0
assert left % 200 == 0

# move the node a bit more
tool_node = editor.node._(label="tool_node").wait_for_present()
self.action_chains().move_to_element(tool_node).click_and_hold().move_by_offset(207, -181).release().perform()

# check if editor position is snapped
top, left = self.get_node_position("tool_node")

assert top % 200 == 0
assert left % 200 == 0

def get_node_position(self, label: str):
node = self.components.workflow_editor.node._(label=label).wait_for_present()

left: str = node.value_of_css_property("left")
top: str = node.value_of_css_property("top")

left_stripped = "".join(char for char in left if char.isdigit())
top_stripped = "".join(char for char in top if char.isdigit())

return (int(left_stripped), int(top_stripped))

def assert_node_output_is(self, label: str, output_type: str, subcollection_type: Optional[str] = None):
editor = self.components.workflow_editor
node_label, output_name = label.split("#")
Expand Down

0 comments on commit 748f747

Please sign in to comment.