Handle attribute changes after changing attribute

In all implementations, internal listeners for attribute changes which are run as "attribute change steps" are run after the attribute is actually changed, not before.

This affects popover attribute related algorithms in HTML: whatwg/html#9048 (comment).

Author: josepharhar

dom.bs

@@ -6297,54 +6297,56 @@ given a <var>document</var>, <var>localName</var>, <var>namespace</var>, and opt
 <a>attribute</a> <var>attribute</var> to <var>value</var>, run these steps:
 
 <ol>
+ <li><p>Set <var>attribute</var>'s <a for=Attr>value</a> to <var>value</var>.
+
  <li><p><a>Handle attribute changes</a> for <var>attribute</var> with <var>attribute</var>'s
  <a for=Attr>element</a>, <var>attribute</var>'s <a for=Attr>value</a>, and <var>value</var>.
-
- <li><p>Set <var>attribute</var>'s <a for=Attr>value</a> to <var>value</var>.
 </ol>
 
 <p>To <dfn export id=concept-element-attributes-append lt="append an attribute">append</dfn> an
 <a>attribute</a> <var>attribute</var> to an <a for=/>element</a> <var>element</var>, run these
 steps:
 
 <ol>
- <li><p><a>Handle attribute changes</a> for <var>attribute</var> with <var>element</var>, null, and
- <var>attribute</var>'s <a for=Attr>value</a>.
-
  <li><p><a for=list>Append</a> <var>attribute</var> to <var>element</var>'s
  <a for=Element>attribute list</a>.
 
  <li><p>Set <var>attribute</var>'s <a for=Attr>element</a> to <var>element</var>.
+
+ <li><p><a>Handle attribute changes</a> for <var>attribute</var> with <var>element</var>, null, and
+ <var>attribute</var>'s <a for=Attr>value</a>.
 </ol>
 
 <p>To <dfn export id=concept-element-attributes-remove lt="remove an attribute">remove</dfn> an
 <a>attribute</a> <var>attribute</var>, run these steps:
 
 <ol>
- <li><p><a>Handle attribute changes</a> for <var>attribute</var> with <var>attribute</var>'s
- <a for=Attr>element</a>, <var>attribute</var>'s <a for=Attr>value</a>, and null.
+ <li><p>Let <var>element</var> be <var>attribute</var>'s <a for=Attr>element</a>.</p></li>
 
- <li><a for=list>Remove</a> <var>attribute</var> from <var>attribute</var>'s
- <a for=Attr>element</a>'s <a for=Element>attribute list</a>.
+ <li><a for=list>Remove</a> <var>attribute</var> from <var>element</var>'s <a for=Element>attribute
+ list</a>.
 
  <li><p>Set <var>attribute</var>'s <a for=Attr>element</a> to null.
+
+ <li><p><a>Handle attribute changes</a> for <var>attribute</var> with <var>element</var>,
+ <var>attribute</var>'s <a for=Attr>value</a>, and null.
 </ol>
 
 <p>To <dfn export id=concept-element-attributes-replace lt="replace an attribute">replace</dfn> an
 <a>attribute</a> <var>oldAttr</var> with an <a>attribute</a> <var>newAttr</var>, run these steps:
 
 <ol>
- <li><p><a>Handle attribute changes</a> for <var>oldAttr</var> with <var>oldAttr</var>'s
- <a for=Attr>element</a>, <var>oldAttr</var>'s <a for=Attr>value</a>, and <var>newAttr</var>'s
- <a for=Attr>value</a>.
-
  <li><p><a for=list>Replace</a> <var>oldAttr</var> by <var>newAttr</var> in <var>oldAttr</var>'s
  <a for=Attr>element</a>'s <a for=Element>attribute list</a>.
 
  <li><p>Set <var>newAttr</var>'s <a for=Attr>element</a> to <var>oldAttr</var>'s
  <a for=Attr>element</a>.
 
  <li><p>Set <var>oldAttr</var>'s <a for=Attr>element</a> to null.
+
+ <li><p><a>Handle attribute changes</a> for <var>oldAttr</var> with <var>newAttr</var>'s
+ <a for=Attr>element</a>, <var>oldAttr</var>'s <a for=Attr>value</a>, and <var>newAttr</var>'s
+ <a for=Attr>value</a>.
 </ol>
 
 <hr>