HumanSignal / HumanSignal/label-studio

Editing an entry added using a <TextArea> with attribute editable="true" throws js error and blanks task annotation area

Open
#1,858 1 comment 1 reaction 1 assignee Claimed by @makseq View on GitHub
editor jira labeling problem
Dominant language
TypeScript
Stars
28.3k
Forks
3.7k
Avg merge
14h
Merged PRs (30d)
15

Description

Editing an entry added using a `` with attribute `editable="true"` throws js error and blanks task annotation area.

The error is Error: Minified React error #31; decoded as:
> Objects are not valid as a React child (found: object with keys {_reactName, _targetInst, type, nativeEvent, target, currentTarget, eventPhase, bubbles, cancelable, timeStamp, defaultPrevented, isTrusted, isDefaultPrevented, isPropagationStopped}). If you meant to render a collection of children, use an array instead.

**To Reproduce**
Steps to reproduce the behavior:
1. Use labeling config including `<TextArea ... editable="true"/>`
e. g.
```
<View>
<Text name="context" value="$context" granularity="word"/>
<TextArea name="questions" toName="context" editable="true" required="true"/>
</View>
```
2. Enter some string in the text area.
3. Press the pen icon on the entered text to edit it.
4. Press any key that would alter the string (e.g. a letter).
5. The task annotation area becomes completely blank. A React js error is thrown.

**Expected behavior**
The string should be edited and updated.

**Environment (please complete the following information):**
- OS: Linux
- Label Studio Version 1.4 (also present in 1.3) run using docker from heartexlabs/label-studio:latest
`docker run heartexlabs/label-studio:latest label-studio start`

The bug is not present if the same config is tested at the [playground](https://labelstud.io/playground/?config=%3CView%3E%3Cbr%3E%3CText%20name%3D%22context%22%20value%3D%22%24context%22%20granularity%3D%22word%22%2F%3E%3Cbr%3E%3CTextArea%20name%3D%22questions%22%20toName%3D%22context%22%20editable%3D%22true%22%20required%3D%22true%22%2F%3E%3Cbr%3E%3C%2FView%3E%3Cbr%3E).

**Additional context**
The error output to the console:
instrument.js:109 Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7B_reactName%2C%20_targetInst%2C%20type%2C%20nativeEvent%2C%20target%2C%20currentTarget%2C%20eventPhase%2C%20bubbles%2C%20cancelable%2C%20timeStamp%2C%20defaultPrevented%2C%20isTrusted%2C%20isDefaultPrevented%2C%20isPropagationStopped%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
at ki (react-dom.production.min.js:140)
at react-dom.production.min.js:150
at La (react-dom.production.min.js:176)
at qs (react-dom.production.min.js:271)
at Ol (react-dom.production.min.js:250)
at Sl (react-dom.production.min.js:250)
at Cl (react-dom.production.min.js:250)
at ml (react-dom.production.min.js:243)
at react-dom.production.min.js:123
at t.unstable_runWithPriority (scheduler.production.min.js:18)
at Wo (react-dom.production.min.js:122)
at Ko (react-dom.production.min.js:123)
at Go (react-dom.production.min.js:122)
at react-dom.production.min.js:244
at Le (react-dom.production.min.js:292)
at Fe (react-dom.production.min.js:49)
at react-dom.production.min.js:50
at Mr (react-dom.production.min.js:105)
at Zt (react-dom.production.min.js:75)
at Qt (react-dom.production.min.js:74)
at t.unstable_runWithPriority (scheduler.production.min.js:18)
at Wo (react-dom.production.min.js:122)
at je (react-dom.production.min.js:292)
at Xt (react-dom.production.min.js:73)
at HTMLDivElement.r (helpers.js:72)
(anonymous) @ instrument.js:109
ss @ react-dom.production.min.js:216
n.callback @ react-dom.production.min.js:216
fi @ react-dom.production.min.js:131
ps @ react-dom.production.min.js:220
Nl @ react-dom.production.min.js:259
t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:122
Rl @ react-dom.production.min.js:252
ml @ react-dom.production.min.js:243
(anonymous) @ react-dom.production.min.js:123
t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:122
Ko @ react-dom.production.min.js:123
Go @ react-dom.production.min.js:122
(anonymous) @ react-dom.production.min.js:244
Le @ react-dom.production.min.js:292
Fe @ react-dom.production.min.js:49
(anonymous) @ react-dom.production.min.js:50
Mr @ react-dom.production.min.js:105
Zt @ react-dom.production.min.js:75
Qt @ react-dom.production.min.js:74
t.unstable_runWithPriority @ scheduler.production.min.js:18
Wo @ react-dom.production.min.js:122
je @ react-dom.production.min.js:292
Xt @ react-dom.production.min.js:73
r @ helpers.js:72

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.