Refactor renderer.getClassList() into renderer.addClass(), renderer.removeClass()

[caridy]

Function setScopeTokenClassIfNecessary calls getClassList(elm) on an element, and assumes the shape of the result value to be a DOM Object and calls .add() on it. Probably we should have a renderer api for just the add operation itself in one go.

[git2gus]

This issue has been linked to a new work item: W-11568519

[nolanlawson]

Rather than exposing the entire classList:

lwc/packages/@lwc/engine-core/src/framework/renderer.ts

Line 45 in fda8d6f

getClassList: (element: E) => DOMTokenList;

... the renderer should have hooks to add or remove classes.

[nolanlawson]

I'm not sure this is entirely possible, because of this code:

lwc/packages/@lwc/engine-core/src/framework/base-lightning-element.ts

Lines 449 to 466 in 2ddff92

	get classList(): DOMTokenList {
	const vm = getAssociatedVM(this);
	const {
	elm,
	renderer: { getClassList },
	} = vm;
	if (process.env.NODE_ENV !== 'production') {
	// TODO [#1290]: this still fails in dev but works in production, eventually, we should
	// just throw in all modes
	assert.isFalse(
	isBeingConstructed(vm),
	`Failed to construct ${vm}: The result must not have attributes. Adding or tampering with classname in constructor is not allowed in a web component, use connectedCallback() instead.`
	);
	}
	return getClassList(elm);
	},

We need to expose this.classList inside of a LightningElement, and to do that we need to have a getClassList on the renderer that returns the entire DOMTokenList.

[caridy]

Sure, but that doesn't mean we use that value to interact with, we just pass it along... then we can have new APIs just for the diffing. Basically, we have two separate buckets, APIs used for rendering, and APIs used for the element instance.

[nolanlawson]

@caridy What is the benefit in that case? We would have the following APIs on the renderer:

• getClassList
• addClass
• removeClass
• containsClass
• classListLength

(This is based on the APIs we actually use in the engine.)

If we expose getClassList anyway, it's not clear to me why we should have the other APIs as well.