[6a3a178] | 1 | function cssBlankPseudo(document, opts) {
|
---|
| 2 | // configuration
|
---|
| 3 | const className = Object(opts).className;
|
---|
| 4 | const attr = Object(opts).attr || 'blank';
|
---|
| 5 | const force = Object(opts).force;
|
---|
| 6 |
|
---|
| 7 | try {
|
---|
| 8 | document.querySelector(':blank');
|
---|
| 9 |
|
---|
| 10 | if (!force) {
|
---|
| 11 | return;
|
---|
| 12 | }
|
---|
| 13 | } catch (ignoredError) {}
|
---|
| 14 | /* do nothing and continue */
|
---|
| 15 | // observe value changes on <input>, <select>, and <textarea>
|
---|
| 16 |
|
---|
| 17 |
|
---|
| 18 | const window = (document.ownerDocument || document).defaultView;
|
---|
| 19 | observeValueOfHTMLElement(window.HTMLInputElement);
|
---|
| 20 | observeValueOfHTMLElement(window.HTMLSelectElement);
|
---|
| 21 | observeValueOfHTMLElement(window.HTMLTextAreaElement);
|
---|
| 22 | observeSelectedOfHTMLElement(window.HTMLOptionElement); // form control elements selector
|
---|
| 23 |
|
---|
| 24 | const selector = 'INPUT,SELECT,TEXTAREA';
|
---|
| 25 | const selectorRegExp = /^(INPUT|SELECT|TEXTAREA)$/; // conditionally update all form control elements
|
---|
| 26 |
|
---|
| 27 | Array.prototype.forEach.call(document.querySelectorAll(selector), node => {
|
---|
| 28 | if (node.nodeName === 'SELECT') {
|
---|
| 29 | node.addEventListener('change', configureCssBlankAttribute);
|
---|
| 30 | } else {
|
---|
| 31 | node.addEventListener('input', configureCssBlankAttribute);
|
---|
| 32 | }
|
---|
| 33 |
|
---|
| 34 | configureCssBlankAttribute.call(node);
|
---|
| 35 | }); // conditionally observe added or unobserve removed form control elements
|
---|
| 36 |
|
---|
| 37 | new MutationObserver(mutationsList => {
|
---|
| 38 | mutationsList.forEach(mutation => {
|
---|
| 39 | Array.prototype.forEach.call(mutation.addedNodes || [], node => {
|
---|
| 40 | if (node.nodeType === 1 && selectorRegExp.test(node.nodeName)) {
|
---|
| 41 | if (node.nodeName === 'SELECT') {
|
---|
| 42 | node.addEventListener('change', configureCssBlankAttribute);
|
---|
| 43 | } else {
|
---|
| 44 | node.addEventListener('input', configureCssBlankAttribute);
|
---|
| 45 | }
|
---|
| 46 |
|
---|
| 47 | configureCssBlankAttribute.call(node);
|
---|
| 48 | }
|
---|
| 49 | });
|
---|
| 50 | Array.prototype.forEach.call(mutation.removedNodes || [], node => {
|
---|
| 51 | if (node.nodeType === 1 && selectorRegExp.test(node.nodeName)) {
|
---|
| 52 | if (node.nodeName === 'SELECT') {
|
---|
| 53 | node.removeEventListener('change', configureCssBlankAttribute);
|
---|
| 54 | } else {
|
---|
| 55 | node.removeEventListener('input', configureCssBlankAttribute);
|
---|
| 56 | }
|
---|
| 57 | }
|
---|
| 58 | });
|
---|
| 59 | });
|
---|
| 60 | }).observe(document, {
|
---|
| 61 | childList: true,
|
---|
| 62 | subtree: true
|
---|
| 63 | }); // update a form control element’s css-blank attribute
|
---|
| 64 |
|
---|
| 65 | function configureCssBlankAttribute() {
|
---|
| 66 | if (this.value || this.nodeName === 'SELECT' && this.options[this.selectedIndex].value) {
|
---|
| 67 | if (attr) {
|
---|
| 68 | this.removeAttribute(attr);
|
---|
| 69 | }
|
---|
| 70 |
|
---|
| 71 | if (className) {
|
---|
| 72 | this.classList.remove(className);
|
---|
| 73 | }
|
---|
| 74 |
|
---|
| 75 | this.removeAttribute('blank');
|
---|
| 76 | } else {
|
---|
| 77 | if (attr) {
|
---|
| 78 | this.setAttribute('blank', attr);
|
---|
| 79 | }
|
---|
| 80 |
|
---|
| 81 | if (className) {
|
---|
| 82 | this.classList.add(className);
|
---|
| 83 | }
|
---|
| 84 | }
|
---|
| 85 | } // observe changes to the "value" property on an HTML Element
|
---|
| 86 |
|
---|
| 87 |
|
---|
| 88 | function observeValueOfHTMLElement(HTMLElement) {
|
---|
| 89 | const descriptor = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'value');
|
---|
| 90 | const nativeSet = descriptor.set;
|
---|
| 91 |
|
---|
| 92 | descriptor.set = function set(value) {
|
---|
| 93 | // eslint-disable-line no-unused-vars
|
---|
| 94 | nativeSet.apply(this, arguments);
|
---|
| 95 | configureCssBlankAttribute.apply(this);
|
---|
| 96 | };
|
---|
| 97 |
|
---|
| 98 | Object.defineProperty(HTMLElement.prototype, 'value', descriptor);
|
---|
| 99 | } // observe changes to the "selected" property on an HTML Element
|
---|
| 100 |
|
---|
| 101 |
|
---|
| 102 | function observeSelectedOfHTMLElement(HTMLElement) {
|
---|
| 103 | const descriptor = Object.getOwnPropertyDescriptor(HTMLElement.prototype, 'selected');
|
---|
| 104 | const nativeSet = descriptor.set;
|
---|
| 105 |
|
---|
| 106 | descriptor.set = function set(value) {
|
---|
| 107 | // eslint-disable-line no-unused-vars
|
---|
| 108 | nativeSet.apply(this, arguments);
|
---|
| 109 | const event = document.createEvent('Event');
|
---|
| 110 | event.initEvent('change', true, true);
|
---|
| 111 | this.dispatchEvent(event);
|
---|
| 112 | };
|
---|
| 113 |
|
---|
| 114 | Object.defineProperty(HTMLElement.prototype, 'selected', descriptor);
|
---|
| 115 | }
|
---|
| 116 | }
|
---|
| 117 |
|
---|
| 118 | export default cssBlankPseudo;
|
---|
| 119 | //# sourceMappingURL=legacy.mjs.map
|
---|