emberjs / emberjs/ember.js

Add `length` to `SafeString`

Open
#20,795 3 comments 1 reaction 0 assignees View on GitHub
Needs RFC
Dominant language
TypeScript
Stars
22.6k
Forks
4.2k
Avg merge
3d 12h
Merged PRs (30d)
15

Description

If we use builtin `isEmpty` on empty `SafeString` instance, we getting incorrect result.

```ts
import { htmlSafe } from '@ember/template';
import { isEmpty } from '@ember/utils';

isEmpty(htmlSafe('')) === false
```

Wondering if we should update `isEmpty` to support `SafeString`...

Real life use case for error:

```hbs
{{#if (isEmpty this.someEmptySafeString)}}
it's not rendered, but ideally it should be
{{/if}}
```

Reproduction: https://limber.glimdown.com/edit?c=AYjmCsGcAIBsEsBuBTaAHATsx9kHcAoeAWzQHsMAXaAYTNLIDtlHqAzDe6AcgAFQExYsgwB6AMb1yzVtwDcRBlWgBvaAAtKxWAGUAhm1QBfaBy59kxAEYjRlS2lh778xeWVr4kAKKlKAT2gTM2IeXksbMQBXSnhYSFcCZAAPd2oAE2Q2PSjYanEnSBgACWRYWDIAdQpYdOgU%2B0Z0mDoGGWoVAgJoer9-fUMdSgx4RlBoAF4NLV0DZAAKbm4ASgUexiZfNACB5CGRscnp7V3FjcotgJWFbuhQZGovS-65-dHQeeXVW56sSiiMIxoE8%2BvNKOovAA6Bw7V7Dd6rW5GLo9AA89lITnsAD4uj9oKj1ABmbGlWBoETQcR6SDIVGiYm4no9fEqFQAYngbGg4KhIO2L0G8LGRmRzPF0EgwvGXl6Ap6AG1JBgsOJKABdVkqMq00X4iVSg4ymDnOUBRWjZWqjVa0RcvX41FWDC4x2MgBCuViQIAkty8PBwdBnrs3mN6YyURK2ZzubzINC%2BqHpXqJcyYYFIHNJdLgTAcJB4FZYKgFZaKNbNWm2TrkKm02bM7nZaaC0WS9AlRXkGqq9GVHa2PWJY7na7xYSSZ68qM888qTTUAGg%2BoyhSMBGSVHmTGudB5vzzfHEwLk0blsOJRmc0a89BW1526WrT2bQ39aptfE62KG9es4YN7vHebbFqW5Yqq%2Bfbimyg4OmmToutuBIerks57su6j3kwjbQGe7ybkyzIfrucYQgmGyMCGcJGpe4qUdRQq3gBqCGsBsqgR2XaQb2JFfrqv5pgxSY0cBbGHC2ZDUJx4GMC%2BvHVgO9qCcR4q3PSGKOM4yC4siIDAAQQA&format=glimdown

Why issue created? Because ember in-tempalte `if` already counting empty `SafeString` as `false`, but there is no official `js` way to check for empty safe string.

I think, we could `workaround` this case, extending `SafeString` class, adding `length` getter.

```ts
export class SafeString implements GlimmerSafeString {
private __string: string;

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

/**
getter to fix isEmpty case
*/
get length() {
return this.__string.length;
}

/**
Get the string back to use as a string.

@public
@method toString
@returns {String} 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} the trusted string, without any escaping applied
*/
toHTML(): string {
return this.toString();
}
}
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.