Semantic-ui: [Security] Documentation on the secure usage of Semantic-UI

[dreaming-augustin]

It would be nice to have a whole section dedicated to security on the Semantic-UI web site, and for each module, a sub-section on the secure use of that particular module.

Currently, some code samples provided in the Semantic-UI documentation are inherently unsecure.

I searched but couldn't find any mention of 'security' in the official documentation, nor anything about potential pitfalls when using some Semantic-UI modules when one does not pay attention to sanitize user input.

[hammy2899]

@dreaming-augustin Please could you elaborate on how data-text is "insecure"

[dreaming-augustin]

@hammy2899 See the fiddle in the linked issue dedicated to data-text:
[Dropdown] Security Vulnerability with data-text #5376

[dreaming-augustin]

This issue is more for a meta discussion on:

• developing security awareness,
• promoting a secure usage of Semantic-UI,
• starting to cover security aspects in the documentation.
• maybe consider providing javascript escape functions for users, and probably Semantic-UI itself, to use to conveniently sanitize user data.

[dreaming-augustin]

The following issue was closed by the stale bot and should be reopened:
XSS issue in semantic dropdown. #4498

[dreaming-augustin]

The following issue was closed by the stale bot and should be reopened:
Content Security Policy #3119

[dreaming-augustin]

Checklist:

• All code in the documentation should be safe by default, and promote safe coding standards. Security should not be an afterthought, but practised diligently from the very first step.
• Mention of security should be included throughout the documentation, wherever appropriate, using a consistent styling so that it can be easily identified as such.
• Each module should have a "Security" tab where attack vectors and prevention can be extensively covered. For example, the search module https://semantic-ui.com/modules/search.html should have a fifth tab called Security beside the existing Definition, Examples, Usage and Settings.
• Use user feedback and PR to progressively enhance and complete the coverage of this important topic.
• link to notable and authoritative web sites like https://www.owasp.org/ and specific pages or sections thereof to incite users to gain broader knowledge of related security issues.

[lubber-de]

We implemented data sanitizing and added a security page to the docs
https://fomantic-ui.com/modules/search.html#/security
https://fomantic-ui.com/modules/dropdown.html#/security

[dreaming-augustin]

@lubber-de What you did is great! Thank you very much for taking the time to implement my main suggestions for documentation. I am very happy that Fomantic is making such progress and taking security issues seriously. Many thanks to the whole team.