Prevent name() and title() from rendering HTML tags

[jynxio]

Description

The methods such as .title() and .name() internally use the element.innerHTML interface for text creation. This implementation causes inputs like <input> to be interpreted as an element, rather than plain text.

gui.add( object, '<input>' ); // The key name of the controller is an <input> element

The proposed solution is to use the element.textContent interface instead.

Other

I have noticed that in /tests/basic.js, the assert.strictEqual function call employs innerHTML, as follows:

assert.strictEqual( controller4.$name.innerHTML, name, 'name sets innerHTML' );

I am unsure of the purpose behind the use of innerHTML in this instance, so I have not modified this script. Please could you check and resolve this issue?

Thank you for your efforts.

[georgealways]

Hi there, thanks for this. I think it makes sense to do this for Controller.name, GUI.title, and the creation of options in OptionController.

I'm not sure we need to change injectStyles—that's not exposed to the user, and I'm reluctant to introduce a change there that might summon browser quirks. Same goes for the kitchen sink and guide examples.

That test is verifying that the name method is working by comparing innerHTML to whatever was passed to the function. We would want change that to textContent as part of this PR. The same goes for any test's mention of $title.innerHTML (if one exists).

Much appreciated!

[georgealways]

Hi @jynxio, this was implemented in the latest release. Thanks for bringing it to my attention.