Add support for nested HTML fragments

RESOLVED WONTFIX

Status

RESOLVED WONTFIX
4 years ago
8 months ago

People

(Reporter: drs, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

4 years ago
Currently, the build system lacks support for nested HTML fragments. Here's an example:

elements/outer.html
===
<element name="outer" extends="section">
  <template>
    <h1>Heading 1</h1>
    <section is="inner"></section>
  </template>
</element>

elements/inner.html
===
<element name="inner" extends="section">
  <template>
    <h2>Heading 2</h2>
  </template>
</element>

In this case, the build system won't insert the commented inner.html code in the <section is="inner"></section> tag, so it can't be lazy loaded.

The best workaround I've found for now is this:

elements/outer.html
===
<element name="outer" extends="section">
  <template>
    <h1>Heading 1</h1>
    <section id="inner-stub"></section>
  </template>
</element>

elements/inner.html
===
<element name="inner" extends="section">
  <template>
    <h2>Heading 2</h2>
  </template>
</element>

index.html
===
<section is="outer"></section>
<section is="inner"></section>

index.js
===
LazyLoad.load([inner, outer], function() {
  var innerStub = document.getElementById('inner-stub');
  innerStub.parentNode.insertBefore(inner, innerStub);
  innerStub.removeChild(innerStub);
});

This is fairly ugly and what we have to do in bug 1054995.
(Reporter)

Updated

4 years ago
Blocks: 1060080
(Reporter)

Updated

4 years ago
Blocks: 1060290

Comment 1

8 months ago
Firefox OS is not being worked on
Status: NEW → RESOLVED
Last Resolved: 8 months ago
Resolution: --- → WONTFIX
You need to log in before you can comment on or make changes to this bug.