styleChecker.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.detectFlexGapSupported = exports.default = exports.canUseDocElement = void 0;
  7. exports.isStyleSupport = isStyleSupport;
  8. var _canUseDom = _interopRequireDefault(require("./canUseDom"));
  9. var canUseDocElement = function canUseDocElement() {
  10. return (0, _canUseDom.default)() && window.document.documentElement;
  11. };
  12. exports.canUseDocElement = canUseDocElement;
  13. var isStyleNameSupport = function isStyleNameSupport(styleName) {
  14. if ((0, _canUseDom.default)() && window.document.documentElement) {
  15. var styleNameList = Array.isArray(styleName) ? styleName : [styleName];
  16. var documentElement = window.document.documentElement;
  17. return styleNameList.some(function (name) {
  18. return name in documentElement.style;
  19. });
  20. }
  21. return false;
  22. };
  23. var isStyleValueSupport = function isStyleValueSupport(styleName, value) {
  24. if (!isStyleNameSupport(styleName)) {
  25. return false;
  26. }
  27. var ele = document.createElement('div');
  28. var origin = ele.style[styleName];
  29. ele.style[styleName] = value;
  30. return ele.style[styleName] !== origin;
  31. };
  32. function isStyleSupport(styleName, styleValue) {
  33. if (!Array.isArray(styleName) && styleValue !== undefined) {
  34. return isStyleValueSupport(styleName, styleValue);
  35. }
  36. return isStyleNameSupport(styleName);
  37. }
  38. var flexGapSupported;
  39. var detectFlexGapSupported = function detectFlexGapSupported() {
  40. if (!canUseDocElement()) {
  41. return false;
  42. }
  43. if (flexGapSupported !== undefined) {
  44. return flexGapSupported;
  45. }
  46. // create flex container with row-gap set
  47. var flex = document.createElement('div');
  48. flex.style.display = 'flex';
  49. flex.style.flexDirection = 'column';
  50. flex.style.rowGap = '1px';
  51. // create two, elements inside it
  52. flex.appendChild(document.createElement('div'));
  53. flex.appendChild(document.createElement('div'));
  54. // append to the DOM (needed to obtain scrollHeight)
  55. document.body.appendChild(flex);
  56. flexGapSupported = flex.scrollHeight === 1; // flex container should be 1px high from the row-gap
  57. document.body.removeChild(flex);
  58. return flexGapSupported;
  59. };
  60. exports.detectFlexGapSupported = detectFlexGapSupported;
  61. var _default = isStyleSupport;
  62. exports.default = _default;