Forker/fluxscape
1
0
Fork 0
mirror of https://github.com/fluxscape/fluxscape.git synced 2026-01-12 23:32:55 +01:00
Code Issues Actions Packages Projects Releases 1 Wiki Activity

feat(runtime): Add "data-testid" attributes to UI nodes (#42)

Browse Source
This commit is contained in:
Eric Tuvesson
2024-06-26 21:08:01 +02:00
committed by GitHub
parent 0ee55c26eb
commit fa282d6169
18 changed files with 129 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/noodl-viewer-react/src/nodes/controls/button.ts
View File

@@ -30,11 +30,24 @@ const ButtonNode = {
]
},
initialize() {
this.props.attrs = {};
this.props.layout = 'row'; //Used to tell child nodes what layout to expect
},
getReactComponent() {
return Button;
},
inputs: {
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputCss: {
backgroundColor: {
index: 100,

11
packages/noodl-viewer-react/src/nodes/controls/checkbox.ts
View File

@@ -31,6 +31,7 @@ const CheckBoxNode = {
]
},
initialize() {
this.props.attrs = {};
this.props.sizeMode = 'explicit';
this.props.id = 'input-' + guid();
this.props.checked = this._internal.checked = false;
@@ -94,6 +95,16 @@ const CheckBoxNode = {
this.flagOutputDirty('checked');
this._updateVisualState();
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputCss: {

11
packages/noodl-viewer-react/src/nodes/controls/options.ts
View File

@@ -31,6 +31,7 @@ const OptionsNode = {
]
},
initialize: function () {
this.props.attrs = {};
this._itemsChanged = () => {
this.forceUpdate();
};
@@ -90,6 +91,16 @@ const OptionsNode = {
this.flagOutputDirty('value');
}
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputProps: {

11
packages/noodl-viewer-react/src/nodes/controls/radiobutton.ts
View File

@@ -31,6 +31,7 @@ const RadioButtonNode = {
]
},
initialize() {
this.props.attrs = {};
this.props.sizeMode = 'explicit';
this.props.id = 'input-' + guid();
@@ -61,6 +62,16 @@ const RadioButtonNode = {
set(value) {
this.setStyle({ backgroundColor: value }, 'fill');
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputProps: {

11
packages/noodl-viewer-react/src/nodes/controls/slider.ts
View File

@@ -27,6 +27,7 @@ const RangeNode = {
]
},
initialize() {
this.props.attrs = {};
this.props.sizeMode = 'contentHeight';
this.props.id = 'input-' + guid();
@@ -67,6 +68,16 @@ const RangeNode = {
set(value) {
this._setInputValue(value);
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
outputs: {

11
packages/noodl-viewer-react/src/nodes/controls/text-input.ts
View File

@@ -43,6 +43,7 @@ const TextInputNode = {
return TextInput;
},
initialize() {
this.props.attrs = {};
this.props.startValue = '';
this.props.id = this._internal.controlId = 'input-' + guid();
},
@@ -167,6 +168,16 @@ const TextInputNode = {
break;
}
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputCss: {

11
packages/noodl-viewer-react/src/nodes/visual/group.js
View File

@@ -11,6 +11,7 @@ const GroupNode = {
groupPriority: ['General', 'Style', 'Events', 'Mounted', 'Hover Events', 'Pointer Events', 'Focus', 'Scroll']
},
initialize() {
this.props.attrs = {};
this._internal = {
scrollElementDuration: 500,
scrollIndexDuration: 500,
@@ -143,6 +144,16 @@ const GroupNode = {
valueChangedToTrue() {
this.context.setNodeFocused(this, true);
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputProps: {

11
packages/noodl-viewer-react/src/nodes/visual/image.js
View File

@@ -27,6 +27,7 @@ const ImageNode = {
]
},
initialize() {
this.props.attrs = {};
this.props.default = '';
},
getReactComponent() {
@@ -86,6 +87,16 @@ const ImageNode = {
this.props.dom.src = getAbsoluteUrl(url);
this.forceUpdate();
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
},
inputProps: {

13
packages/noodl-viewer-react/src/nodes/visual/text.js
View File

@@ -20,6 +20,9 @@ const TextNode = {
nodeDoubleClickAction: {
focusPort: 'text'
},
initialize() {
this.props.attrs = {};
},
getReactComponent() {
return Text;
},
@@ -135,6 +138,16 @@ const TextNode = {
break;
}
}
},
testId: {
index: 100009,
displayName: 'Test ID Attribute',
group: 'Advanced HTML',
type: 'string',
set(value) {
this.props.attrs["data-testid"] = value;
this.forceUpdate();
}
}
}
};