Improve <selectedoption> performance

This patch improves the performance of <selectedoption> by replacing the
SynchronousMutationObserver with the existing async MutationObserver in
HTMLOptionElement.

The change from sync to async impacts some tests. The timing is being
discussed in a standards issue here:
whatwg/html#10520

Fixed: 336844298
Change-Id: I9693de9cf35913e7daaebb364c4923dcd4a2dc39
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5758741
Reviewed-by: Mason Freed <[email protected]>
Commit-Queue: Joey Arhar <[email protected]>
Cr-Commit-Position: refs/heads/main@{#1337462}

html/semantics/forms/the-select-element/stylable-select/selectedoption.tentative.html

@@ -36,22 +36,27 @@
     'The innerHTML of <selectedoption> should initially match the innerHTML of the selected <option>.');
 
   select.value = 'two';
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     'The innerHTML of <selectedoption> should change after the selected option is changed.');
 
   spanTwo.textContent = 'new span';
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     '<selectedoption> should respond to text content changes.');
 
   spanTwo.appendChild(document.createElement('div'));
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     '<selectedoption> should respond to new elements being added to descendants.');
 
   spanTwo.setAttribute('data-foo', 'bar');
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     '<selectedoption> should respond to attributes being added to descendants.');
 
   form.reset();
+  await new Promise(queueMicrotask);
   assert_equals(select.value, 'one',
     'form.reset() should change the selects value to one.');
   assert_equals(selectedOption.innerHTML, optionOne.innerHTML,
@@ -60,19 +65,22 @@
   await test_driver.bless();
   select.showPicker();
   await test_driver.click(optionTwo);
+  await new Promise(queueMicrotask);
   assert_equals(select.value, 'two',
     'Clicking on another option should change select.value.');
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     'Clicking on an option element should update the <selectedoption>.');
 
   selectedOption.remove();
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, '',
     'Removing the <selectedoption> from the <select> should make it clear its contents.');
   button.appendChild(selectedOption);
   assert_equals(selectedOption.innerHTML, optionTwo.innerHTML,
     'Re-inserting the <selectedoption> should make it update its contents.');
 
   optionTwo.remove();
+  await new Promise(queueMicrotask);
   assert_equals(selectedOption.innerHTML, optionOne.innerHTML,
     'The innerHTML of <selectedoption> should be updated in response to selected <option> removal.');
   optionOne.remove();