Eliminate usage of CSSPseudoElement from KeyframeEffect.
Replace ElementOrCSSPseudoElement with Element and add PseudoElement (which is
a DOMString) into KeyframeAnimationOptions and KeyframeEffect.
Differential Revision: https://phabricator.services.mozilla.com/D62667
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1610981
gecko-commit: ebfed5eb1869b1bdcb566ae805e6ee742e0a4323
gecko-integration-branch: autoland
gecko-reviewers: birtles, smaug
diff --git a/web-animations/interfaces/Animatable/animate.html b/web-animations/interfaces/Animatable/animate.html
index 4d17d2d..ba10b17 100644
--- a/web-animations/interfaces/Animatable/animate.html
+++ b/web-animations/interfaces/Animatable/animate.html
@@ -265,7 +265,7 @@
getComputedStyle(div,"::marker").content; // Sync style
const anim = div.animate(null, {pseudoElement: '::marker'});
assert_class_string(anim, 'Animation', 'The returned object is an Animation for ::marker');
-}, 'animate() with pseudoElement parameter creates an Animation object for ::marker');
+}, 'animate() with pseudoElement parameter creates an Animation object for ::marker');
test(t => {
const div = createDiv(t);
@@ -273,7 +273,7 @@
div.textContent = 'foo';
const anim = div.animate(null, {pseudoElement: '::first-line'});
assert_class_string(anim, 'Animation', 'The returned object is an Animation for ::first-line');
-}, 'animate() with pseudoElement parameter creates an Animation object for ::first-line');
+}, 'animate() with pseudoElement parameter creates an Animation object for ::first-line');
test(t => {
const div = createDiv(t);
@@ -318,5 +318,19 @@
}, 'animate() with pseudoElement an Animation object targeting ' +
'the correct pseudo-element for ::first-line');
+for (const pseudo of [
+ '',
+ 'before',
+ '::abc',
+ '::placeholder',
+]) {
+ test(t => {
+ const div = createDiv(t);
+ assert_throws_js(TypeError, () => {
+ div.animate(null, {pseudoElement: pseudo});
+ });
+ }, `animate() with the invalid pseudoElement '${pseudo}' throws a TypeError`);
+}
+
</script>
</body>
diff --git a/web-animations/interfaces/KeyframeEffect/target.html b/web-animations/interfaces/KeyframeEffect/target.html
index a9827d6..eaef10f 100644
--- a/web-animations/interfaces/KeyframeEffect/target.html
+++ b/web-animations/interfaces/KeyframeEffect/target.html
@@ -255,7 +255,18 @@
}
}
-
+for (const pseudo of [
+ '',
+ 'before',
+ '::abc',
+ '::placeholder',
+]) {
+ test(t => {
+ const effect = new KeyframeEffect(null, gKeyFrames, 100 * MS_PER_SEC);
+ assert_throws_js(TypeError, () => effect.pseudoElement = pseudo );
+ }, `Changing pseudoElement to invalid pseudo-selector '${pseudo}' throws a ` +
+ `TypeError`);
+}
</script>
</body>
