legacy.mjs 3.9 KB

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