Support for this.html in addition to html for tagged template literals

It’d be handy for this.html to also be formatted by prettier. I use wicked-elements a lot and taking this example, it would be great if it was supported:

From wicked-elements repository

<div>

import {render, html, svg} from 'lighterhtml';
const LighterHTML = {
  html() { return render(this.element, html.apply(null, arguments)); },
  svg() { return render(this.element, svg.apply(null, arguments)); }
};

import {define} from 'wicked-elements';
define('.my-component', {
  ...LighterHTML,
  init() { this.render(); },
  render() {
    this.html`<h3>Hello 👋</h3>`;
  }
});

</div>

Prettier 1.19.1 Playground link

--parser babel

Input:

html`<div>I look great!</div>`;
this.html`<div>I don't look so good</div>`;

Output:

html`
  <div>I look great!</div>
`;
this.html`<div>I don't look so good</div>`;

Expected behavior: this.html should be supported also.

Thank you!

[fisker]

Now that prettier has implemented formatting for html and css code inside JavaScript/TypeScript tag functions I would like to request to expand this behavior to the same syntax but with a this. in front of html and css respectively. Several frameworks use class methods for their html and css functions.

Actual Behavior

html`
<div>
  <p>text</p>
</div>
`

Requested Feature

this.html`
<div>
  <p>text</p>
</div>
`

What do you think? Thank you!

---

Original post by @timonson in #8672

[davidmerrique]

I’m totally fine with disabling it by default (which looks like it’s coming) and enabling via configuration.

It’d be a welcome enhancement if anything foo.html`...` would work.

Thanks guys.