mirror of
https://github.com/n8n-io/n8n.git
synced 2024-12-25 04:34:06 -08:00
test: Set up e2e tests for HTTP Request node (#4718)
* 🧪 Add test identifiers * ⚡ Add getters * 🧪 Add initial test * ⚡ Refactor to use actions * ⚡ Refactor per Oleg's advice * 🐛 Fix overlapping input label IDs
This commit is contained in:
parent
1821bb0699
commit
62d30f2b43
23
cypress/e2e/4-http-request-node.cy.ts
Normal file
23
cypress/e2e/4-http-request-node.cy.ts
Normal file
|
@ -0,0 +1,23 @@
|
|||
import { WorkflowsPage as WorkflowsPageClass } from '../pages/workflows';
|
||||
import { WorkflowPage as WorkflowPageClass } from '../pages/workflow';
|
||||
|
||||
const WorkflowsPage = new WorkflowsPageClass();
|
||||
const WorkflowPage = new WorkflowPageClass();
|
||||
|
||||
describe('HTTP Request node', () => {
|
||||
beforeEach(() => {
|
||||
cy.skipSetup();
|
||||
});
|
||||
|
||||
it('should make a request with a URL and receive a response', () => {
|
||||
WorkflowsPage.actions.createWorkflowFromCard();
|
||||
WorkflowPage.actions.addInitialNodeToCanvas('Manual Trigger');
|
||||
WorkflowPage.actions.addNodeToCanvas('HTTP Request');
|
||||
WorkflowPage.actions.openNodeNdv('HTTP Request');
|
||||
WorkflowPage.actions.typeIntoParameterInput('url', 'https://google.com');
|
||||
|
||||
WorkflowPage.actions.executeNodeFromNdv();
|
||||
|
||||
WorkflowPage.getters.ndvOutputPanel().contains('<!doctype html>');
|
||||
});
|
||||
});
|
|
@ -1,11 +1,50 @@
|
|||
import { BasePage } from "./base";
|
||||
import { BasePage } from './base';
|
||||
|
||||
export class WorkflowPage extends BasePage {
|
||||
url = '/workflow/new';
|
||||
getters = {
|
||||
workflowNameInput: () => cy.getByTestId('workflow-name-input', { timeout: 5000 }).then($el => cy.wrap($el.find('input'))),
|
||||
workflowNameInput: () =>
|
||||
cy
|
||||
.getByTestId('workflow-name-input', { timeout: 5000 })
|
||||
.then(($el) => cy.wrap($el.find('input'))),
|
||||
workflowImportInput: () => cy.getByTestId('workflow-import-input'),
|
||||
workflowTags: () => cy.getByTestId('workflow-tags'),
|
||||
saveButton: () => cy.getByTestId('save-button'),
|
||||
|
||||
nodeCreatorSearchBar: () => cy.getByTestId('node-creator-search-bar'),
|
||||
nodeCreatorPlusButton: () => cy.getByTestId('node-creator-plus-button'),
|
||||
canvasPlusButton: () => cy.getByTestId('canvas-plus-button'),
|
||||
canvasNodeBox: (nodeDisplayName: string) => {
|
||||
return cy
|
||||
.getByTestId('canvas-node-box-title')
|
||||
.contains(nodeDisplayName)
|
||||
.parents('[data-test-id="canvas-node-box"]');
|
||||
},
|
||||
|
||||
ndvParameterInput: (parameterName: string) =>
|
||||
cy.getByTestId(`parameter-input-${parameterName}`),
|
||||
ndvOutputPanel: () => cy.getByTestId('output-panel'),
|
||||
};
|
||||
|
||||
actions = {
|
||||
addInitialNodeToCanvas: (nodeDisplayName: string) => {
|
||||
this.getters.canvasPlusButton().click();
|
||||
this.getters.nodeCreatorSearchBar().type(nodeDisplayName);
|
||||
this.getters.nodeCreatorSearchBar().type('{enter}{esc}');
|
||||
},
|
||||
addNodeToCanvas: (nodeDisplayName: string) => {
|
||||
this.getters.nodeCreatorPlusButton().click();
|
||||
this.getters.nodeCreatorSearchBar().type(nodeDisplayName);
|
||||
this.getters.nodeCreatorSearchBar().type('{enter}{esc}');
|
||||
},
|
||||
openNodeNdv: (nodeTypeName: string) => {
|
||||
this.getters.canvasNodeBox(nodeTypeName).dblclick();
|
||||
},
|
||||
typeIntoParameterInput: (parameterName: string, content: string) => {
|
||||
this.getters.ndvParameterInput(parameterName).type(content);
|
||||
},
|
||||
executeNodeFromNdv: () => {
|
||||
cy.contains('Execute node').click();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -24,4 +24,10 @@ export class WorkflowsPage extends BasePage {
|
|||
// myWorkflows: () => cy.getByTestId('my-workflows'),
|
||||
// allWorkflows: () => cy.getByTestId('all-workflows'),
|
||||
};
|
||||
|
||||
actions = {
|
||||
createWorkflowFromCard: () => {
|
||||
this.getters.newWorkflowButtonCard().click();
|
||||
},
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="node-wrapper" :style="nodePosition" :id="nodeId">
|
||||
<div class="node-wrapper" :style="nodePosition" :id="nodeId" data-test-id="canvas-node-box">
|
||||
<div class="select-background" v-show="isSelected"></div>
|
||||
<div :class="{'node-default': true, 'touch-active': isTouchActive, 'is-touch-device': isTouchDevice}" :data-name="data.name" :ref="data.name">
|
||||
<div :class="nodeClass" :style="nodeStyle" @click.left="onClick" v-touch:start="touchStart" v-touch:end="touchEnd">
|
||||
|
@ -80,7 +80,7 @@
|
|||
</div>
|
||||
<div class="node-description">
|
||||
<div class="node-name ph-no-capture" :title="nodeTitle">
|
||||
<p>
|
||||
<p data-test-id="canvas-node-box-title">
|
||||
{{ nodeTitle }}
|
||||
</p>
|
||||
<p v-if="data.disabled">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<div v-if="!createNodeActive" :class="[$style.nodeButtonsWrapper, showStickyButton ? $style.noEvents : '']" @mouseenter="onCreateMenuHoverIn">
|
||||
<div :class="$style.nodeCreatorButton">
|
||||
<div :class="$style.nodeCreatorButton" data-test-id="node-creator-plus-button">
|
||||
<n8n-icon-button size="xlarge" icon="plus" type="tertiary" :class="$style.nodeCreatorPlus" @click="openNodeCreator" :title="$locale.baseText('nodeView.addNode')"/>
|
||||
<div :class="[$style.addStickyButton, showStickyButton ? $style.visibleButton : '']" @click="addStickyNote">
|
||||
<n8n-icon-button size="medium" type="tertiary" :icon="['far', 'note-sticky']" :title="$locale.baseText('nodeView.addSticky')"/>
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
:value="value"
|
||||
@input="onInput"
|
||||
:class="$style.input"
|
||||
data-test-id="node-creator-search-bar"
|
||||
/>
|
||||
</div>
|
||||
<div :class="$style.suffix" v-if="value.length > 0" @click="clear">
|
||||
|
|
|
@ -70,6 +70,7 @@
|
|||
</template>
|
||||
<template #output>
|
||||
<OutputPanel
|
||||
data-test-id="output-panel"
|
||||
:canLinkRuns="canLinkRuns"
|
||||
:runIndex="outputRun"
|
||||
:linkedRuns="linked"
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
:required="parameter.required"
|
||||
:showTooltip="focused"
|
||||
:showOptions="menuExpanded"
|
||||
:data-test-id="parameter.name"
|
||||
>
|
||||
<template #options>
|
||||
<parameter-options
|
||||
|
|
|
@ -20,7 +20,9 @@
|
|||
@blur="onBlur"
|
||||
@drop="onDrop"
|
||||
@textInput="onTextInput"
|
||||
@valueChanged="onValueChanged" />
|
||||
@valueChanged="onValueChanged"
|
||||
:data-test-id="`parameter-input-${parameter.name}`"
|
||||
/>
|
||||
<input-hint v-if="expressionOutput" :class="$style.hint" :highlight="!!(expressionOutput && targetItem)" :hint="expressionOutput" />
|
||||
<input-hint v-else-if="parameterHint" :class="$style.hint" :renderHTML="true" :hint="parameterHint" />
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div :class="$style.container" :style="containerCssVars" ref="container">
|
||||
<n8n-tooltip placement="top" :value="showTooltip" manual :disabled="isScrimActive" :popper-class="$style.tooltip" :open-delay="700">
|
||||
<button :class="$style.button" @click="$emit('click')">
|
||||
<button :class="$style.button" @click="$emit('click')" data-test-id="canvas-plus-button">
|
||||
<font-awesome-icon icon="plus" size="lg" />
|
||||
</button>
|
||||
<template #content>
|
||||
|
|
Loading…
Reference in a new issue