Skip to content

Commit dcf05cd

Browse files
KristinAokiKristinAoki
authored
fix: tinymce render outside of editors (#1254)
1 parent 34f0bf5 commit dcf05cd

File tree

36 files changed

+339
-175
lines changed

36 files changed

+339
-175
lines changed

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/AnswerOption.jsx

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,9 @@ const AnswerOption = ({
2525
intl,
2626
// redux
2727
problemType,
28+
images,
29+
isLibrary,
30+
learningContextId,
2831
}) => {
2932
const dispatch = useDispatch();
3033
const removeAnswer = hooks.removeAnswer({ answer, dispatch });
@@ -47,6 +50,11 @@ const AnswerOption = ({
4750
setContent={setAnswerTitle}
4851
placeholder={intl.formatMessage(messages.answerTextboxPlaceholder)}
4952
id={`answer-${answer.id}`}
53+
{...{
54+
images,
55+
isLibrary,
56+
learningContextId,
57+
}}
5058
/>
5159
);
5260
}
@@ -106,6 +114,11 @@ const AnswerOption = ({
106114
setSelectedFeedback={setSelectedFeedback}
107115
setUnselectedFeedback={setUnselectedFeedback}
108116
intl={intl}
117+
{...{
118+
images,
119+
isLibrary,
120+
learningContextId,
121+
}}
109122
/>
110123
</Collapsible.Body>
111124
</div>
@@ -135,10 +148,16 @@ AnswerOption.propTypes = {
135148
intl: intlShape.isRequired,
136149
// redux
137150
problemType: PropTypes.string.isRequired,
151+
images: PropTypes.shape({}).isRequired,
152+
learningContextId: PropTypes.string.isRequired,
153+
isLibrary: PropTypes.bool.isRequired,
138154
};
139155

140156
export const mapStateToProps = (state) => ({
141157
problemType: selectors.problem.problemType(state),
158+
images: selectors.app.images(state),
159+
isLibrary: selectors.app.isLibrary(state),
160+
learningContextId: selectors.app.learningContextId(state),
142161
});
143162

144163
export const mapDispatchToProps = {};

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/AnswerOption.test.jsx

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,18 @@ jest.mock('../../../../../data/redux', () => ({
1010
default: jest.fn(),
1111
selectors: {
1212
problem: {
13-
answers: jest.fn(state => ({ answers: state })),
1413
problemType: jest.fn(state => ({ problemType: state })),
1514
},
15+
app: {
16+
images: jest.fn(state => ({ images: state })),
17+
isLibrary: jest.fn(state => ({ isLibrary: state })),
18+
learningContextId: jest.fn(state => ({ learningContextId: state })),
19+
},
1620
},
1721
thunkActions: {
18-
video: jest.fn(),
22+
video: {
23+
importTranscripts: jest.fn(),
24+
},
1925
},
2026
}));
2127

@@ -49,6 +55,9 @@ describe('AnswerOption', () => {
4955
intl: { formatMessage },
5056
// redux
5157
problemType: 'multiplechoiceresponse',
58+
images: {},
59+
isLibrary: false,
60+
learningContextId: 'course+org+run',
5261
};
5362
describe('render', () => {
5463
test('snapshot: renders correct option with feedback', () => {
@@ -72,5 +81,20 @@ describe('AnswerOption', () => {
7281
mapStateToProps(testState).problemType,
7382
).toEqual(selectors.problem.problemType(testState));
7483
});
84+
test('images from app.images', () => {
85+
expect(
86+
mapStateToProps(testState).images,
87+
).toEqual(selectors.app.images(testState));
88+
});
89+
test('learningContextId from app.learningContextId', () => {
90+
expect(
91+
mapStateToProps(testState).learningContextId,
92+
).toEqual(selectors.app.learningContextId(testState));
93+
});
94+
test('isLibrary from app.isLibrary', () => {
95+
expect(
96+
mapStateToProps(testState).isLibrary,
97+
).toEqual(selectors.app.isLibrary(testState));
98+
});
7599
});
76100
});

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/__snapshots__/AnswerOption.test.jsx.snap

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,9 @@ exports[`AnswerOption render snapshot: renders correct option with feedback 1`]
3030
error={false}
3131
errorMessage={null}
3232
id="answer-A"
33+
images={{}}
34+
isLibrary={false}
35+
learningContextId="course+org+run"
3336
placeholder="Enter an answer"
3437
setContent={[Function]}
3538
value="Answer 1"
@@ -44,11 +47,14 @@ exports[`AnswerOption render snapshot: renders correct option with feedback 1`]
4447
"title": "Answer 1",
4548
}
4649
}
50+
images={{}}
4751
intl={
4852
{
4953
"formatMessage": [Function],
5054
}
5155
}
56+
isLibrary={false}
57+
learningContextId="course+org+run"
5258
problemType="multiplechoiceresponse"
5359
setSelectedFeedback={[Function]}
5460
setUnselectedFeedback={[Function]}
@@ -121,11 +127,14 @@ exports[`AnswerOption render snapshot: renders correct option with numeric input
121127
"title": "Answer 1",
122128
}
123129
}
130+
images={{}}
124131
intl={
125132
{
126133
"formatMessage": [Function],
127134
}
128135
}
136+
isLibrary={false}
137+
learningContextId="course+org+run"
129138
problemType="numericalresponse"
130139
setSelectedFeedback={[Function]}
131140
setUnselectedFeedback={[Function]}
@@ -213,11 +222,14 @@ exports[`AnswerOption render snapshot: renders correct option with numeric input
213222
"unselectedFeedback": "unselected feedback",
214223
}
215224
}
225+
images={{}}
216226
intl={
217227
{
218228
"formatMessage": [Function],
219229
}
220230
}
231+
isLibrary={false}
232+
learningContextId="course+org+run"
221233
problemType="numericalresponse"
222234
setSelectedFeedback={[Function]}
223235
setUnselectedFeedback={[Function]}
@@ -276,6 +288,9 @@ exports[`AnswerOption render snapshot: renders correct option with selected unse
276288
error={false}
277289
errorMessage={null}
278290
id="answer-A"
291+
images={{}}
292+
isLibrary={false}
293+
learningContextId="course+org+run"
279294
placeholder="Enter an answer"
280295
setContent={[Function]}
281296
value="Answer 1"
@@ -291,11 +306,14 @@ exports[`AnswerOption render snapshot: renders correct option with selected unse
291306
"unselectedFeedback": "unselected feedback",
292307
}
293308
}
309+
images={{}}
294310
intl={
295311
{
296312
"formatMessage": [Function],
297313
}
298314
}
315+
isLibrary={false}
316+
learningContextId="course+org+run"
299317
problemType="choiceresponse"
300318
setSelectedFeedback={[Function]}
301319
setUnselectedFeedback={[Function]}

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/FeedbackBox.jsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,18 @@ export const FeedbackBox = ({
1212
problemType,
1313
setSelectedFeedback,
1414
setUnselectedFeedback,
15+
images,
16+
isLibrary,
17+
learningContextId,
1518
// injected
1619
intl,
1720
}) => {
1821
const props = {
1922
answer,
2023
intl,
24+
images,
25+
isLibrary,
26+
learningContextId,
2127
};
2228

2329
return ((problemType === ProblemTypeKeys.MULTISELECT) ? (
@@ -61,6 +67,9 @@ FeedbackBox.propTypes = {
6167
setAnswer: PropTypes.func.isRequired,
6268
setSelectedFeedback: PropTypes.func.isRequired,
6369
setUnselectedFeedback: PropTypes.func.isRequired,
70+
images: PropTypes.shape({}).isRequired,
71+
learningContextId: PropTypes.string.isRequired,
72+
isLibrary: PropTypes.bool.isRequired,
6473
intl: intlShape.isRequired,
6574
};
6675

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/FeedbackBox.test.jsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ const answerWithFeedback = {
88
selectedFeedback: 'some feedback',
99
unselectedFeedback: 'unselectedFeedback',
1010
problemType: 'sOMepRObleM',
11+
images: {},
12+
isLibrary: false,
13+
learningContextId: 'course+org+run',
1114
};
1215

1316
const props = {

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/FeedbackControl.jsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,9 @@ const FeedbackControl = ({
1515
answer,
1616
intl,
1717
type,
18+
images,
19+
isLibrary,
20+
learningContextId,
1821
}) => (
1922
<Form.Group>
2023
<Form.Label className="mb-3">
@@ -31,6 +34,11 @@ const FeedbackControl = ({
3134
value={feedback}
3235
setContent={onChange}
3336
placeholder={intl.formatMessage(messages.feedbackPlaceholder)}
37+
{...{
38+
images,
39+
isLibrary,
40+
learningContextId,
41+
}}
3442
/>
3543
</Form.Group>
3644
);
@@ -41,6 +49,9 @@ FeedbackControl.propTypes = {
4149
labelMessageBoldUnderline: PropTypes.string.isRequired,
4250
answer: answerOptionProps.isRequired,
4351
type: PropTypes.string.isRequired,
52+
images: PropTypes.shape({}).isRequired,
53+
learningContextId: PropTypes.string.isRequired,
54+
isLibrary: PropTypes.bool.isRequired,
4455
intl: intlShape.isRequired,
4556
};
4657

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/FeedbackControl.test.jsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,9 @@ const props = {
1818
onChange: jest.fn(),
1919
labelMessage: 'msg',
2020
labelMessageBoldUnderline: 'msg',
21+
images: {},
22+
isLibrary: false,
23+
learningContextId: 'course+org+run',
2124
};
2225

2326
describe('FeedbackControl component', () => {

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/__snapshots__/FeedbackBox.test.jsx.snap

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,9 @@ exports[`FeedbackBox component renders as expected with a multi select problem 1
99
{
1010
"correct": true,
1111
"id": "A",
12+
"images": {},
13+
"isLibrary": false,
14+
"learningContextId": "course+org+run",
1215
"problemType": "sOMepRObleM",
1316
"selectedFeedback": "some feedback",
1417
"title": "Answer 1",
@@ -39,6 +42,9 @@ exports[`FeedbackBox component renders as expected with a multi select problem 1
3942
{
4043
"correct": true,
4144
"id": "A",
45+
"images": {},
46+
"isLibrary": false,
47+
"learningContextId": "course+org+run",
4248
"problemType": "sOMepRObleM",
4349
"selectedFeedback": "some feedback",
4450
"title": "Answer 1",
@@ -76,6 +82,9 @@ exports[`FeedbackBox component renders as expected with a numeric input problem
7682
{
7783
"correct": true,
7884
"id": "A",
85+
"images": {},
86+
"isLibrary": false,
87+
"learningContextId": "course+org+run",
7988
"problemType": "sOMepRObleM",
8089
"selectedFeedback": "some feedback",
8190
"title": "Answer 1",
@@ -113,6 +122,9 @@ exports[`FeedbackBox component renders as expected with default props 1`] = `
113122
{
114123
"correct": true,
115124
"id": "A",
125+
"images": {},
126+
"isLibrary": false,
127+
"learningContextId": "course+org+run",
116128
"problemType": "sOMepRObleM",
117129
"selectedFeedback": "some feedback",
118130
"title": "Answer 1",

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/components/Feedback/__snapshots__/FeedbackControl.test.jsx.snap

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,9 @@ exports[`FeedbackControl component renders 1`] = `
2929
error={false}
3030
errorMessage={null}
3131
id="undefinedFeedback-A"
32+
images={{}}
33+
isLibrary={false}
34+
learningContextId="course+org+run"
3235
placeholder={null}
3336
setContent={[MockFunction]}
3437
value="feedback"

‎src/editors/containers/ProblemEditor/components/EditProblemView/AnswerWidget/hooks.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -42,22 +42,22 @@ export const setAnswerTitle = ({
4242
dispatch(actions.problem.updateAnswer({ id: answer.id, hasSingleAnswer, title }));
4343
};
4444

45-
export const setSelectedFeedback = ({ answer, hasSingleAnswer, dispatch }) => (e) => {
46-
if (e.target) {
45+
export const setSelectedFeedback = ({ answer, hasSingleAnswer, dispatch }) => (value) => {
46+
if (value) {
4747
dispatch(actions.problem.updateAnswer({
4848
id: answer.id,
4949
hasSingleAnswer,
50-
selectedFeedback: e.target.value,
50+
selectedFeedback: value,
5151
}));
5252
}
5353
};
5454

55-
export const setUnselectedFeedback = ({ answer, hasSingleAnswer, dispatch }) => (e) => {
56-
if (e.target) {
55+
export const setUnselectedFeedback = ({ answer, hasSingleAnswer, dispatch }) => (value) => {
56+
if (value) {
5757
dispatch(actions.problem.updateAnswer({
5858
id: answer.id,
5959
hasSingleAnswer,
60-
unselectedFeedback: e.target.value,
60+
unselectedFeedback: value,
6161
}));
6262
}
6363
};

0 commit comments

Comments
 (0)