All files / src/utils css.util.js

100% Statements 39/39
100% Branches 0/0
100% Functions 0/0
100% Lines 39/39

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 401x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x  
const cssVarsToRegister = /** @type {const} */([
  '--qrcode-color',
  '--qrcode-dark-color',
  '--qrcode-light-color',
  '--qrcode-corner-color',
  '--qrcode-corner-border-color',
  '--qrcode-corner-center-color',
  '--qrcode-margin',
  '--qrcode-resize',
  '--qrcode-style',
  '--qrcode-dot-style',
  '--qrcode-corner-border-style',
  '--qrcode-corner-center-style',
])
 
/**
 * Registers CSS properties to fix Chrome "allow-discrete" transition on Chrome
 * @see https://issues.chromium.org/issues/360159391
 */
export function registerCSSProperties () {
  for (const name of cssVarsToRegister) {
    try {
      CSS.registerProperty({ name, inherits: true })
    } catch (e) {
      if (e instanceof DOMException) {
        // property registered, ignore it
      } else {
        throw e // re-throw the error
      }
    }
  }
}
 
export const varObserverCSSRules = `
  transition-property: ${cssVarsToRegister.join(',')};
  transition-duration: 1ms;
  transition-timing-function: step-start;
  transition-behavior: allow-discrete;
`