cristianbote/goober

`css()` taken by surprise when `this` is `window` (in “old-school” JS environment)

domq opened this issue · 1 comments

domq commented

Fiddle at https://jsfiddle.net/2f6uzmb5/6/

Steps to reproduce:

  1. Import Goober “the old-school way” e.g. with
    <script src="https://cdn.jsdelivr.net/npm/goober@2.1.13/dist/goober.umd.js" />
  2. Set window.target to something that internal function getSheet() won't like
  3. Call css()

Expected result: css() should return a fresh CSS class name.

Actual result:

TypeError: e.querySelector is not a function

(where e is presumably the minified variable that holds window.target inside getSheet())

From reading the relevant source code, it looks like setting any of window.p, window.g, window.o or window.k could also result in funny behavior.

This doesn't happen in a modern (ESM) environment, as they dropped the idea of squeezing the global object into this-less function calls.

This will also happen when using esbuild to bundle, since it doesn't emit the "use strict" directive at the top of each bundled module.

See this esbuild-based repro: 2023-09-05_esbuild-x-goober_bug.tgz

and my fix: #562