Skip to content

Commit

Permalink
[DOCS BETA] Document the SafeString type
Browse files Browse the repository at this point in the history
Also use `unknown` instead of `any` in one spot.

(cherry picked from commit 730ae35)
  • Loading branch information
chriskrycho authored and kategengler committed Feb 20, 2023
1 parent 565b1cc commit 8c2f360
Show file tree
Hide file tree
Showing 2 changed files with 49 additions and 3 deletions.
50 changes: 48 additions & 2 deletions packages/@ember/-internals/glimmer/lib/utils/string.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,63 @@

import type { SafeString as GlimmerSafeString } from '@glimmer/runtime';

/**
A wrapper around a string that has been marked as safe ("trusted"). **When
rendered in HTML, Ember will not perform any escaping.**
Note:
1. This does not *make* the string safe; it means that some code in your
application has *marked* it as safe using the `htmlSafe()` function.
2. The only public API for getting a `SafeString` is calling `htmlSafe()`. It
is *not* user-constructible.
If a string contains user inputs or other untrusted data, you must sanitize
the string before using the `htmlSafe` method. Otherwise your code is
vulnerable to [Cross-Site Scripting][xss]. There are many open source
sanitization libraries to choose from, both for front end and server-side
sanitization.
[xss]: https://owasp.org/www-community/attacks/DOM_Based_XSS
```javascript
import { htmlSafe } from '@ember/template';
let someTrustedOrSanitizedString = "<div>Hello!</div>"
htmlSafe(someTrustedorSanitizedString);
```
@public
@since 4.12.0
@class SafeString
*/
export class SafeString implements GlimmerSafeString {
private __string: string;

constructor(string: string) {
this.__string = string;
}

/**
Get the string back to use as a string.
@public
@method toString
@returns The string marked as trusted
*/
toString(): string {
return `${this.__string}`;
}

/**
Get the wrapped string as HTML to use without escaping.
@public
@method toHTML
@returns string
*/
toHTML(): string {
return this.toString();
}
Expand Down Expand Up @@ -115,8 +161,8 @@ export function htmlSafe(str: string): SafeString {
```javascript
import { htmlSafe, isHTMLSafe } from '@ember/template';
var plainString = 'plain string',
safeString = htmlSafe('<div>someValue</div>');
let plainString = 'plain string';
let safeString = htmlSafe('<div>someValue</div>');
isHTMLSafe(plainString); // false
isHTMLSafe(safeString); // true
Expand Down
2 changes: 1 addition & 1 deletion packages/@ember/string/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -290,7 +290,7 @@ export function htmlSafe(str: string): SafeString {
return internalHtmlSafe(str);
}

export function isHTMLSafe(str: any | null | undefined): str is SafeString {
export function isHTMLSafe(str: unknown): str is SafeString {
deprecateImportFromString('isHTMLSafe');

return internalIsHtmlSafe(str);
Expand Down

0 comments on commit 8c2f360

Please sign in to comment.