fix(snackbar): address Trusted Types violation

Assigning a string directly to the innerHTML property is potentially security sensitive, and thus causes a Trusted Types violation. This blocks apps using mdc-snackbar from adopting Trusted Types.

Refactor the innerHTML assignment to the equivalent construction using native DOM APIs which is compatible with Trusted Types.

This was tested on JAWS 2022/Chrome 99, verifying that screen reading behaviour was equivalent before and after this change.

PiperOrigin-RevId: 435754345

Author: material-web-copybara

packages/mdc-snackbar/util.ts

@@ -67,7 +67,12 @@ function announce(ariaEl: Element, labelEl: Element = ariaEl) {
   //       - IE 11
   //   * ChromeVox 53
   labelEl.textContent = '';
-  labelEl.innerHTML = '<span style="display: inline-block; width: 0; height: 1px;">&nbsp;</span>';
+  // For the second case, assigning a string directly to innerHTML results in a
+  // Trusted Types violation. Work around that by using document.createElement.
+  const span = document.createElement('span');
+  span.setAttribute('style', 'display: inline-block; width: 0; height: 1px;');
+  span.textContent = '\u00a0';  // Equivalent to &nbsp;
+  labelEl.appendChild(span);
 
   // Prevent visual jank by temporarily displaying the label text in the ::before pseudo-element.
   // CSS generated content is normally announced by screen readers