topological-nodered-wdio 1.0.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "topological-nodered-wdio",
3
3
  "description": "Open source WebdriverIO nodes for Node-RED",
4
- "version": "1.0.0",
4
+ "version": "1.1.0",
5
5
  "author": "topological",
6
6
  "license": "MIT",
7
7
  "repository": {
@@ -1,5 +1,5 @@
1
1
  <script type="text/javascript">
2
- function setAction() {
2
+ const setAction = () => {
3
3
  let action = $('#node-input-action').val()
4
4
  $('#actionSendKeys').hide()
5
5
  $('#getAttribute').hide()
@@ -11,13 +11,61 @@
11
11
  }
12
12
  }
13
13
 
14
+ const showSelectors = () => {
15
+ let locateType = $('#node-input-locateType').prop('checked')
16
+ if (locateType) {
17
+ $('.node-input-locateValues-container-row').show()
18
+ $('#node-input-locateValue').parent().hide()
19
+ $('#node-input-locateUsing').parent().hide()
20
+ } else {
21
+ $('.node-input-locateValues-container-row').hide()
22
+ $('#node-input-locateValue').parent().show()
23
+ $('#node-input-locateUsing').parent().show()
24
+ }
25
+ }
26
+
27
+ const multiSelectorsUI = (node) => {
28
+ $('#node-input-locateValues-container').css('min-height', '50vh').css('min-width', '600px').editableList({
29
+ addItem: function (container, index, data) {
30
+ container.css({
31
+ overflow: 'hidden',
32
+ whiteSpace: 'nowrap'
33
+ });
34
+ let fragment = document.createDocumentFragment();
35
+ var row = $('<div/>', { style: "display:flex;" }).appendTo(fragment);
36
+ var selectField = $('<select/>', { class: "node-input-locateValues-using", style: "width:30%; margin-right:10px;border-radius:5px; border: 1px solid lightgray; outline-color: rgba(85, 150, 230, 0.8); outline-width: thin;" }).appendTo(row);
37
+ selectField.append($('<option>', { value: 'id', text: 'id' }));
38
+ selectField.append($('<option>', { value: 'name', text: 'name' }));
39
+ selectField.append($('<option>', { value: 'css selector', text: 'CSS selector' }));
40
+ selectField.append($('<option>', { value: 'link text', text: 'Link text' }));
41
+ selectField.append($('<option>', { value: 'partial link text', text: 'Partial link text' }));
42
+ selectField.append($('<option>', { value: 'tag name', text: 'Tag name' }));
43
+ selectField.append($('<option>', { value: 'xpath', text: 'XPath' }));
44
+ var inputField = $('<input/>', { class: "node-input-locateValues-value", style: "width:65%; margin-right:10px;border-radius:5px; border: 1px solid lightgray; outline-color: rgba(85, 150, 230, 0.8); outline-width: thin;", placeholder: "selector" }).appendTo(row);
45
+ if (data === null || data === undefined) {
46
+ data = { using: 'xpath', value: '' }
47
+ }
48
+ selectField.val(data.using)
49
+ inputField.val(data.value)
50
+ container.append(fragment)
51
+ },
52
+ removable: true,
53
+ sortable: true
54
+ })
55
+
56
+ $('#node-input-locateValues-container').editableList('addItems', node.locateValues || []);
57
+ }
58
+
59
+
14
60
  RED.nodes.registerType('element-action', {
15
61
  category: 'Webdriver IO',
16
62
  color: '#a6bbcf',
17
63
  defaults: {
18
64
  name: { value: '' },
19
65
  locateUsing: { value: 'xpath' },
66
+ locateType: { value: false },
20
67
  locateValue: { value: '' },
68
+ locateValues: { value: [] },
21
69
  action: { value: 'click' },
22
70
  sendKeys: {
23
71
  value: '',
@@ -29,38 +77,46 @@
29
77
  inputs: 1,
30
78
  outputs: 1,
31
79
  icon: 'white-globe.png',
32
- label: function() {
80
+ label: function () {
33
81
  return this.name || 'element action'
34
82
  },
35
- oneditprepare: function() {
83
+ oneditprepare: function () {
84
+ var that = this
36
85
  setAction()
86
+ showSelectors()
87
+ multiSelectorsUI(that)
37
88
  $('#node-input-sendKeys').typedInput({
38
89
  default: 'str',
39
90
  typeField: $('#node-input-object'),
40
91
  types: ['msg', 'flow', 'global', 'str']
41
92
  })
93
+ },
94
+ oneditsave: function () {
95
+ var node = this
96
+ var locateType = $('#node-input-locateType').prop('checked')
97
+ node.locateType = locateType
98
+ if (locateType) {
99
+ var locateValues = $('#node-input-locateValues-container').editableList('items')
100
+ node.locateValues = []
101
+ locateValues.each(function () {
102
+ var using = $(this).find('.node-input-locateValues-using').val()
103
+ var value = $(this).find('.node-input-locateValues-value').val()
104
+ node.locateValues.push({ using, value })
105
+ })
106
+ } else {
107
+ node.locateValues = []
108
+ node.locateValue = $('#node-input-locateValue').val()
109
+ node.locateUsing = $('#node-input-locateUsing').val()
110
+ }
42
111
  }
43
112
  })
44
113
  </script>
45
114
 
46
115
  <script type="text/x-red" data-template-name="element-action">
47
116
  <div class="form-row">
48
- <label for="node-input-locateUsing"><i class="fa fa-tasks"></i> Locate Method</label>
49
- <select type="text" id="node-input-locateUsing" style="width:70%;">
50
- <option value="id">id</option>
51
- <option value="name">name</option>
52
- <option value="css selector">CSS selector</option>
53
- <option value="link text">Link text</option>
54
- <option value="partial link text">Partial link text</option>
55
- <option value="tag name">Tag name</option>
56
- <option value="xpath" selected>XPath</option>
57
- </select>
58
- </div>
59
- <div class="form-row">
60
- <label for="node-input-locateValue"><i class="fa fa-tasks"></i> Selector</label>
61
- <input id="node-input-locateValue" type="text">
117
+ <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
118
+ <input id="node-input-name" type="text">
62
119
  </div>
63
-
64
120
  <div class="form-row">
65
121
  <label for="node-input-action"><i class="fa fa-tasks"></i> Action</label>
66
122
  <select type="text" id="node-input-action" style="width:70%;" onchange="setAction()">
@@ -84,9 +140,29 @@
84
140
  <input id="node-input-attribute" type="text">
85
141
  </div>
86
142
  <div class="form-row">
87
- <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
88
- <input id="node-input-name" type="text">
143
+ <label for="node-input-locateType"><i class="fa fa-tasks"></i> Multiple Selector?</label>
144
+ <input id="node-input-locateType" type="checkbox" style="width:30px;" onchange="showSelectors()">
89
145
  </div>
146
+ <div class="form-row">
147
+ <label for="node-input-locateUsing"><i class="fa fa-tasks"></i> Locate Method</label>
148
+ <select type="text" id="node-input-locateUsing" style="width:70%;">
149
+ <option value="id">id</option>
150
+ <option value="name">name</option>
151
+ <option value="css selector">CSS selector</option>
152
+ <option value="link text">Link text</option>
153
+ <option value="partial link text">Partial link text</option>
154
+ <option value="tag name">Tag name</option>
155
+ <option value="xpath" selected>XPath</option>
156
+ </select>
157
+ </div>
158
+ <div class="form-row">
159
+ <label for="node-input-locateValue"><i class="fa fa-tasks"></i> Selector</label>
160
+ <input id="node-input-locateValue" type="text">
161
+ </div>
162
+ <div class="form-row node-input-locateValues-container-row" style="position:relative">
163
+ <h4 style="margin-bottom: -3px;">Selectors :</h4>
164
+ <ol id="node-input-locateValues-container"></ol>
165
+ </div>
90
166
  </script>
91
167
 
92
168
  <script type="text/x-red" data-help-name="element-action">
@@ -130,4 +206,4 @@
130
206
  </ul>
131
207
  </p>
132
208
  <p><b>Text to Send</b> if the Send Keys action is selected, this value would send the text to the selected web element.<br></p>
133
- </script>
209
+ </script>
@@ -41,9 +41,11 @@ module.exports = function(RED) {
41
41
 
42
42
  node.on('input', async (msg) => {
43
43
  try {
44
- let locateUsing = config.locateUsing || msg.locateUsing
45
- let locateValue = config.locateValue || msg.locateValue
46
-
44
+ let multiple = config.locateType || msg.locateType
45
+ let locateValues = config.locateValues || msg.locateValues
46
+ let locateUsing = multiple ? locateValues[0].using : config.locateUsing || msg.locateUsing
47
+ let locateValue = multiple ? locateValues[0].value : config.locateValue || msg.locateValue
48
+
47
49
  let browser = await common.getBrowser(context)
48
50
  let capabilities = browser.capabilities
49
51
  let elementId = await common.getElementId(