text format consistency (text font, text size) for all text input fields

[zqian]

CAE supports WYSIWYG text input for "short description", "long description", "privacy agreement", and "support resources". Those text field values will all be displayed in the "find more" screen.

It is very likely for user to copy and paste text directly from external web pages, and hence those field values will contain different fonts and text sizes. Can we "sanitize" the html text to make a consistent style display in the "find more" page?

[ssciolla]

"Because the admin editor (TinyMCE) currently allows anything, including copy and pasting styles, and the frontend presents this with dangerouslySetInnerHTML there was some desire to better restrict the tags and content that can be used both by the editor and displayed.

This could either be done in the backend when the content is delivered to the API or possibly in React. We have to determine what things we want to whitelist, like links, and possibly simple formatting like bold/italic/colors, and block everything else."

Comment by @jonespm in the duplicate issue (#217)

[ziegler1960]

This fix has been verified - after entering text with a variety of formatting into the TinyMCE and Saving, the Short Description output on the frontend ALP card displays a common font type and size, while preserving other formats from the original HTML such as inline links, bolding, and italics.

Test Course: https://umich.beta.instructure.com/courses/587202/external_tools/48681

• [ ] From the CAE tool on the test course, click Admin link at the upper right to access the Admin UI
• [ ] Select 'Lti tools' to see the list of cards
• [ ] Click on a tool: Active Learning Platform
• [ ] Copy a selection of text with a variety of formats (font size and type, bold, italic, web link) from a web page (https://www.yahoo.com/entertainment/rolling-stones-announce-grrr-live-140053553.html) and paste into the short description field for the tool.
• [ ] Click Save - LTI tool list loads
• [ ] Click View Site link to return to the CAE tool on the course
• [ ] Verify that the Short Description output on the frontend ALP card has a common font type and size, while preserving other formats from the original HTML such as inline links, bolding, and italics.
• [ ] Return to Admin UI -> Lti tools -> click on the ACC listing
• [ ] Restore the original text to the ALP Short Description field ("Active Learning Platform facilitates an engaging and active learning space for lectures.") and Save
• [ ] Return to the course and verify that the ALP Short Description is displaying the original text