feat(testing-library): add an overload for template rendering

[lacolaco]

Close #203

• Add render(template: string, options: RenderTemplateOptions) overload
• Deprecate render(directive, { template })
• Rename directives.spec.ts to render-template.spec.ts
• Update specs and examples to the new signature
  • Single spec is left for validating backward-compatibility

I believe this change won't break existing tests as long as users aren't restricting @deprecated API usage.

[lacolaco]

This is an only difference between render(directive, { template }) and render(template). Is it acceptable?

[timdeschryver]

Yes, this fine.

[timdeschryver]

Do you have an opinion about the naming of componentProperties ?
Should it be better to name this wrapperComponentProperties or hostComponentProperties?

[lacolaco]

I like wrapperComponentProperties which has consistency with wrapper.

[lacolaco]

But I think it is hard to change the name now. Because RenderComponentOptions and RenderDirectiveOptions still has componentProperties, making overload with co-existing these are complex.

[lacolaco]

I'm thinking of two options.

Option 1. Just properties or props in all type of render options

Vue or other families are adopting that. And it is not relevant directly, Storybook for Angular has also a similar API. This option brings breaking change for the entire package but the result is simple.

https://storybook.js.org/docs/angular/writing-stories/introduction

export default {
  title: 'Components/Button',
  component: Button,
} as Meta;

export const Primary = () => ({
  props: {
    label: 'Button',
    background: '#ff0',
  },
});

Option 2. Extending wrapper for passing wrapper component properties. Implementation for this is more complex than Option 1.

{
  wrapper: {
    component: WrapperComponent,
    properties: { ... }
  }
}

[timdeschryver]

I like option 1, and you're (again) totally right.
Let's leave it with componentProperties, and we might rename that in a next breaking version.
I won't do it know, just because this is a minor difference.

[timdeschryver]

Thanks for the PR @lacolaco , I added one question about naming a property.
The rest is 👍👍.

[timdeschryver]

Thanks for your ideas and the implementation!

[timdeschryver]

@all-contributors please add @lacolaco for code, ideas

[allcontributors]

@timdeschryver

I've put up a pull request to add @lacolaco! 🎉

[github-actions]

🎉 This PR is included in version 10.6.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀