fix(surveys): keep a typed hosted intro description editable

Typing a description into an intro whose content type was unset left the type
unset, which renders as HTML, so the canvas swapped the field for the read-only
HTML view. Canvas edits are plain text, so they now pin the type to text.

Tested: jest src/scenes/surveys/hosted-canvas passes; the new two-edit test fails
without the fix.

Author: lucasheriques

frontend/src/scenes/surveys/hosted-canvas/HostedSurveyCanvas.test.tsx

@@ -86,6 +86,41 @@ describe('HostedSurveyCanvas', () => {
         }
     )
 
+    it('keeps a typed intro description editable when the content type was unset', () => {
+        const survey: Survey = {
+            ...baseSurvey,
+            appearance: {
+                ...baseSurvey.appearance,
+                introScreenDescription: '',
+                introScreenDescriptionContentType: undefined,
+            },
+        }
+        const logic = surveyLogic({ id: survey.id })
+        logic.mount()
+        logic.actions.loadSurveySuccess(survey)
+        const renderCanvas = (): JSX.Element => (
+            <BindLogic logic={surveyLogic} props={{ id: survey.id }}>
+                <HostedSurveyCanvas
+                    survey={logic.values.survey as Survey}
+                    activePageIndex={-1}
+                    pageKind="intro"
+                    viewport="desktop"
+                />
+            </BindLogic>
+        )
+        const { rerender } = render(renderCanvas())
+
+        for (const text of ['First draft', 'Second draft']) {
+            fireEvent.click(screen.getByLabelText('Intro description'))
+            fireEvent.change(screen.getByLabelText('Intro description'), { target: { value: text } })
+            fireEvent.blur(screen.getByLabelText('Intro description'))
+            rerender(renderCanvas())
+        }
+
+        expect(logic.values.survey.appearance?.introScreenDescription).toBe('Second draft')
+        expect(logic.values.survey.appearance?.introScreenDescriptionContentType).toBe('text')
+    })
+
     it.each([
         ['an unset content type', undefined, true],
         ['an html content type', 'html', true],

frontend/src/scenes/surveys/hosted-canvas/IntroCanvas.tsx

@@ -39,7 +39,12 @@ export function IntroCanvas({ survey }: { survey: Survey | NewSurvey }): JSX.Ele
                     as="p"
                     className="intro-screen-body"
                     value={appearance.introScreenDescription || ''}
-                    onChange={(value) => updateAppearance({ introScreenDescription: value })}
+                    onChange={(value) =>
+                        updateAppearance({
+                            introScreenDescription: value,
+                            introScreenDescriptionContentType: 'text',
+                        })
+                    }
                     placeholder="Add an opening message (optional)"
                     ariaLabel="Intro description"
                     multiline