marko-js / marko

A declarative, HTML-based language that makes building web apps fun
https://markojs.com/
MIT License
13.37k stars 644 forks source link

marko-body="static-text" attribute fails when HTML node of same type is within escaped block #343

Closed jskorupski closed 3 years ago

jskorupski commented 8 years ago

Bug Report

Context

I have a project where we embed another templating language inside of a marko template. Because of this, there are cases where we need to disable Marko's parsing for sections of HTML, so that Marko does not try to parse foreign template syntax that may throw errors. We use the marko-body="static-text" attribute to disable Marko parsing.

HTML snippets that causes parser error:

Example 1: `

Content Goes Here

`

Example 2: `

Other Content
<section>Content Goes Here</section>

`

Note that the element type of node with marko-body attribute must match some element within it.

Expected Behavior

The output should be:

Example 1: `

Content Goes Here

`

Example 2: `

Other Content
<section>Content Goes Here</section>

`

Actual Behavior

Example 1: Parser error - 'The closing "div" tag was not expected' Example 1: Parser error - 'The closing "section " tag was not expected'

Possible Fix

Additional Info ### Your Environment - Versions used: - Marko 3.8.1 - Lasso 2.5.5 - Lasso-Marko 2.0.7 - Operating System and version (desktop or mobile): Ubuntu 14.04 - Link to your project: (eBay Internal) ### Steps to Reproduce Input either of these pieces of code on http://markojs.com/try-online/ `
Content Goes Here
` `
Other Content
Content Goes Here
` ### Stack Trace Example 1: Parser error - 'The closing "div" tag was not expected' Example 1: Parser error - 'The closing "section " tag was not expected'
patrick-steele-idem commented 8 years ago

Some notes:

One possible solution:

<marko-parser body='static-text'>
    <section>
        <div>Other Content</div>
        <section>Content Goes Here</section>
    </section>
</marko-parser>

Thoughts?

jskorupski commented 8 years ago

A custom tag would be great! Another huge benefit of a custom marko-parser tag (versus attribute on a rendered tag) is that it can act a non-rendered parser directive, resulting in no additional HTML output/DOM structure change.

Background: When I used the existing version of this marko-body attribute, I wanted to be able to ignore a block of HTML (which contained non-marko compatible AngularJS syntax in it), but not result in a new non-functional node that wraps the content (which can potentially affect animation and browser compositing performance depending on the kind of operations you perform on your DOM elements). I ended up attaching the marko-body attribute to each HTML element, but had to be careful of the same element type within to prevent this gotcha.

DylanPiercey commented 3 years ago

Changing parsing modes is now handled by marko.json files, and is not really recommended anyway.