Prevent escaping in all languages

[adamszalapski]

Jira

http://vjira2:8080/browse/BDS-543

Summary

Apply escaping to all languages in code snippet component.

Details

Changes are only in a js file. It's simple remove of variable and escape without checking language.

How to test

Run this code locally. Go to localhost:3000/pattern-lab. Navigate: Styleguide > Sassdocs > View All then on right navigation Tools: typhography > @mixin bolt-font-family and/or Tools: typhography > @mixin bolt-font-size and check if &, <, > are showed unescaped. You can create new pattern-lab page and apply to it: {% include "@bolt-components-code-snippet/code-snippet.twig" with { display: "block", lang: "html", content: "<bolt-list> <bolt-list-item></bolt-list-item> <bolt-list-item></bolt-list-item> <bolt-list-item></bolt-list-item> </bolt-list>" } only %} to check if all languages are escaped please chenge lang and content variable.

[bolt-bot]

⚡ PR built on Travis and deployed a now preview here:

• Branch link: https://bugfix-prevent-escaping-in-all-languages.boltdesignsystem.com
• Permalink: https://boltdesignsystem-esvhlcttym.now.sh

• Commit built: 2ffa931
• Travis build

[mikemai2awesome]

@adam2661

I did some testing and it is still not working well. Take a look at the following:

✅ SCSS/CSS is working

❌ HTML is not working as expected

There is a discrepancy between using the twig vs the web component, can this be fixed?

cc @danielamorse

[danielamorse]

@mikemai2awesome I setup the same test and got the same result. No space between tags. This is because the code-snippet twig template wraps the content in a spaceless tag. Whereas the web component skips that part. I'm not sure if it's safe to remove that spaceless tag or not. I think ideally we'd use spaceless plus some JS code prettifier?

@adam2661 this is the work @sghoweri did on this file. If you haven't seen this yet, I'm sorry I didn't link to it sooner! You might check it out and see if it solves the problem you are working on.

[mikemai2awesome]

This is working as expected with the usage of {%- verbatim -%}.

[danielamorse]

Tested locally, works as expected. Approved!