polymer: `dom-repeat` inside `table` element is having unexpected behavior in 2.0 preview

When we set a dom-repeat inside a table element, it presents the content outside the table.

  <template>
    <table>
      <thead>
        <tr><th>Header</th></tr>
      </thead>
      <tbody>
        <dom-repeat items="{{items}}">
          <template>
            <tr>
              <td>{{item.name}}</td>
            </tr>
          </template>
        </dom-repeat>
      </tbody>
      <tfoot>
        <tr><td>Footer</td></tr>
      </tfoot>
    </table>
  </template>

But if we instead use the former syntax template is="dom-repeat", it works as expected.

  <template>
    <table>
      <thead>
        <tr><th>Header</th></tr>
      </thead>
      <tbody>
        
          <template is="dom-repeat" items="{{items}}">
            <tr>
              <td>{{item.name}}</td>
            </tr>
          </template>
        
      </tbody>
      <tfoot>
        <tr><td>Footer</td></tr>
      </tfoot>
    </table>
  </template>

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 1
Comments: 31 (4 by maintainers)

Most upvoted comments

@gechols Yes, @trusktr is correct. Just use <template is="dom-repeat"> when you’re working inside any Polymer-managed template (i.e., an element template, dom-bind, or another dom-repeat or dom-if). This works now in 2.0-preview, and is noted in the preview docs.

Working on Release Candidate docs now, where we will clarify that this is the recommended path.

arthurevans on Mar 1, 2017

@kevinpschaaf’s comment mentions is="" will continue to be supported in templates.

I believe he is implying that you are to use the is="" attribute inside a template to solve any problems similar to the initial post, and avoid using the element form of dom-repeat.

In other words, I think he means: “we support the attribute form of dom-repeat for those cases, not the element form, so no fix is needed for the element form and don’t use element form for those cases”.

trusktr on Mar 1, 2017

Yeah, heavy handed. For now, better to stick with the “is” attribute and use the polyfill for safari only.

reinert on Nov 12, 2016

Maybe if the other browser vendors knew the lengths people have to go to now that extending builtin elements is gone, they might change how they feel about is.

richardkazuomiller on Nov 9, 2016

@kevinpschaaf this is horrible. Have you argued this case to get the “is” attribute accepted by everybody?

reinert on Nov 8, 2016

Interesting. Thanks.

#damnApple

reinert on Nov 7, 2016