diff --git a/plugins/css-blank-pseudo/src/browser.js b/plugins/css-blank-pseudo/src/browser.js
index 691ce89b7..e2a1bee1c 100644
--- a/plugins/css-blank-pseudo/src/browser.js
+++ b/plugins/css-blank-pseudo/src/browser.js
@@ -1,8 +1,14 @@
-/* global document,MutationObserver */
+/* global document,window,self,MutationObserver */
import isValidReplacement from './is-valid-replacement.mjs';
// form control elements selector
-const BLANK_CANDIDATES = 'input,select,textarea';
+function isFormControlElement(element) {
+ if (element.nodeName === 'INPUT' || element.nodeName === 'SELECT' || element.nodeName === 'TEXTAREA') {
+ return true;
+ }
+
+ return false;
+}
function createNewEvent(eventName) {
let event;
@@ -21,8 +27,6 @@ function generateHandler(replaceWith) {
let selector;
let remove;
let add;
- const matches = typeof document.body.matches === 'function'
- ? 'matches' : 'msMatchesSelector';
if (replaceWith[0] === '.') {
selector = replaceWith.slice(1);
@@ -37,7 +41,7 @@ function generateHandler(replaceWith) {
return function handleInputOrChangeEvent(event) {
const element = event.target;
- if (!element[matches](BLANK_CANDIDATES)) {
+ if (!isFormControlElement(element)) {
return;
}
@@ -111,39 +115,62 @@ export default function cssBlankPseudoInit(opts) {
const handler = generateHandler(options.replaceWith);
- document.body.addEventListener('change', handler);
- document.body.addEventListener('input', handler);
-
- // observe value changes on ,