Lit Element VSCode plugin Unknown attribute 'frameborder'

Question

I'm using an iframe in the template of a lit element and the lit element VSCode plugin draws this errors:

Unknown attribute 'frameborder'. Did you mean '.frameBorder'? This is a built in tag. Please consider using a 'data-*' attribute, adding the attribute to 'globalAttributes' or disabling the 'no-unknown-attribute' rule.lit-plugin(no-unknown-attribute)(2318)

Anyone know if it's possible to tell the plugin to ignore the attribute?

Answer 1

Check this:

This error indicates that your lit-html template references a tag that the lit-analyzer can’t resolve.

There must be a declaration of the element to TypeScript in order for the analyzer to find it. For example:

export class FancySlider extends HTMLElement {
  value: number;
  // etc...
}
customElements.define('fancy-slider', FancySlider);

declare global {
  interface HTMLElementTagNameMap {
    'fancy-slider': FancySlider,
  }
}

How to fix it Three conditions must hold:

1. There must be a type for the element in TypeScript, either because the code for the element is written in TpeScript, or because there are TypeScript typings for the element.
2. The type must be associated with the element’s tagname in the HTMLElementTagNameMap.
3. The file where you’re using the element must depend on the declaration of the element, generally by importing it. Most commonly, you’re just missing an import for the element. If you’re importing the element, and your code works at runtime, then you need to define an interface for the element, and add it to the HTMLElementTagNameMap.

How it’s configured

This error is enabled by default. It can be disabled by setting skipUnknownTags to true.

To ignore errors about tags without declaring them to the TypeScript type system, you can add them to globalTags, however it is almost always a better idea to declare a type instead.

Source: https://lit.tools/unknown-tag