fix: spread not being reactive

[abdulsattar]

Details

lwc:spread was not reactive when used with @track decorator. The properties within the object were being accessed when patching the element, which is outside of the template reactive observer. This PR moves it to within the render method, which is invoked during template reactive observer. It also makes the code much simpler.

Does this pull request introduce a breaking change?

• ✅ No, it does not introduce a breaking change.

Does this pull request introduce an observable change?

• ✅ No, it does not introduce an observable change.

GUS work item

[abdulsattar]

/nucleus ignore -m "lwc-platform snapshot tests are failing"

[ekashida]

Follow existing comment format?

Suggested change

	// Spread
	// Properties: lwc:spread directive

[ekashida]

Question on the ordering here, should an innerHTML coming in through lwc:spread override the lwc:inner-html directive?

[abdulsattar]

Good question! It should override that HTML just like it overrides all other properties. Added a test for it.

[nolanlawson]

I see we have a test for spread overriding props already:

lwc/packages/@lwc/integration-karma/test/spread/x/test/test.html

Line 3 in 062d08c

<x-child class="x-child-overridden" name="lwc" onclick={templateClick} lwc:spread={overriddenProps}></x-child>

However, this tests onclick, which I think behaves a bit differently in the compiler compared to standard props. Can we add a test to ensure that spread overrides standard props? (If it doesn't already exist.)

E.g.:

{
  foo: 'bar',
  ...props // where props is { foo: 'baz' }
} // result should be 'baz'

[abdulsattar]

name in the above example is a regular prop.

[nolanlawson]

Ah, my mistake! Totally missed that.

[nolanlawson]

This is indeed way simpler than before, love it! Just had one nitpick about tests.

[nolanlawson]

I see we have a test for spread overriding props already:

lwc/packages/@lwc/integration-karma/test/spread/x/test/test.html

Line 3 in 062d08c

<x-child class="x-child-overridden" name="lwc" onclick={templateClick} lwc:spread={overriddenProps}></x-child>

However, this tests onclick, which I think behaves a bit differently in the compiler compared to standard props. Can we add a test to ensure that spread overrides standard props? (If it doesn't already exist.)

E.g.:

{
  foo: 'bar',
  ...props // where props is { foo: 'baz' }
} // result should be 'baz'

[ekashida]

lgtm!