mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-08 17:22:31 +03:00
Code Activity

Change whitelist to allowlist (#31066)

Browse Source 
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
This commit is contained in:
Patrick H. Lauke
2020-06-19 09:31:37 +01:00
committed by GitHub
parent 7acf586d3e
commit edbcc401c2
8 changed files with 34 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/5.0/components/popovers.md
+3 -3
View File
@@ -142,7 +142,7 @@ To allow keyboard users to activate your popovers, you should only add them to H
While you can insert rich, structured HTML in popovers with the `html` option, we strongly recommend that you avoid adding an excessive amount of content. The way popovers currently work is that, once displayed, their content is tied to the trigger element with the `aria-describedby` attribute. As a result, the entirety of the popover's content will be announced to assistive technology users as one long, uninterrupted stream.
Additionally, while it is possible to also include interactive controls (such as form elements or links) in your popover (by adding these elements to the `whiteList` or allowed attributes and tags), be aware that currently the popover does not manage keyboard focus order. When a keyboard user opens a popover, focus remains on the triggering element, and as the popover usually does not immediately follow the trigger in the document's structure, there is no guarantee that moving forward/pressing <kbd>TAB</kbd> will move a keyboard user into the popover itself. In short, simply adding interactive controls to a popover is likely to make these controls unreachable/unusable for keyboard users and users of assistive technologies, or at the very least make for an illogical overall focus order. In these cases, consider using a modal dialog instead.
Additionally, while it is possible to also include interactive controls (such as form elements or links) in your popover (by adding these elements to the `allowList` of allowed attributes and tags), be aware that currently the popover does not manage keyboard focus order. When a keyboard user opens a popover, focus remains on the triggering element, and as the popover usually does not immediately follow the trigger in the document's structure, there is no guarantee that moving forward/pressing <kbd>TAB</kbd> will move a keyboard user into the popover itself. In short, simply adding interactive controls to a popover is likely to make these controls unreachable/unusable for keyboard users and users of assistive technologies, or at the very least make for an illogical overall focus order. In these cases, consider using a modal dialog instead.
{{< /callout >}}
### Options
@@ -150,7 +150,7 @@ Additionally, while it is possible to also include interactive controls (such as
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-animation=""`.
{{< callout warning >}}
Note that for security reasons the `sanitize`, `sanitizeFn` and `whiteList` options cannot be supplied using data attributes.
Note that for security reasons the `sanitize`, `sanitizeFn`, and `allowList` options cannot be supplied using data attributes.
{{< /callout >}}
<table class="table">
@@ -270,7 +270,7 @@ Note that for security reasons the `sanitize`, `sanitizeFn` and `whiteList` opti
<td>Enable or disable the sanitization. If activated <code>'template'</code>, <code>'content'</code> and <code>'title'</code> options will be sanitized.</td>
</tr>
<tr>
<td>whiteList</td>
<td>allowList</td>
<td>object</td>
<td><a href="{{< docsref "/getting-started/javascript#sanitizer" >}}">Default value</a></td>
<td>Object which contains allowed attributes and tags</td>
site/content/docs/5.0/components/tooltips.md
+2 -2
View File
@@ -156,7 +156,7 @@ Elements with the `disabled` attribute aren't interactive, meaning users cannot
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-animation=""`.
{{< callout warning >}}
Note that for security reasons the `sanitize`, `sanitizeFn` and `whiteList` options cannot be supplied using data attributes.
Note that for security reasons the `sanitize`, `sanitizeFn`, and `allowList` options cannot be supplied using data attributes.
{{< /callout >}}
<table class="table">
@@ -278,7 +278,7 @@ Note that for security reasons the `sanitize`, `sanitizeFn` and `whiteList` opti
<td>Enable or disable the sanitization. If activated <code>'template'</code> and <code>'title'</code> options will be sanitized.</td>
</tr>
<tr>
<td>whiteList</td>
<td>allowList</td>
<td>object</td>
<td><a href="{{< docsref "/getting-started/javascript#sanitizer" >}}">Default value</a></td>
<td>Object which contains allowed attributes and tags</td>