chore: Replace global with globalThis (#6407)

.eslintrc.js

@@ -119,6 +119,9 @@ module.exports = {
   },
   plugins: ['react', 'import'],
   extends: ['uber-jsx', 'uber-es2015', 'prettier', 'prettier/react', 'plugin:import/errors'],
+  "globals": {
+    "globalThis": false // means it is not writeable
+  },
   settings: {
     'import/core-modules': [
       '@luma.gl/core',

modules/aggregation-layers/bundle.js

@@ -1,8 +1,6 @@
 const deckGLLayers = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.LineLayer) {

modules/arcgis/bundle.js

@@ -1,8 +1,6 @@
 const ArcGISUtils = require('./src/load-modules');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/carto/bundle.js

@@ -1,8 +1,6 @@
 const CartoUtils = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.LineLayer) {

modules/core/package.json

@@ -38,6 +38,8 @@
     "gl-matrix": "^3.0.0",
     "math.gl": "^3.5.4",
     "mjolnir.js": "^2.5.0",
-    "probe.gl": "^3.4.0"
+    "@probe.gl/env": "^3.5.0-alpha.4",
+    "@probe.gl/log": "^3.5.0-alpha.4",
+    "@probe.gl/stats": "^3.5.0-alpha.4"
   }
 }

modules/core/src/lib/deck.js

@@ -31,7 +31,7 @@ import {deepEqual} from '../utils/deep-equal';
 import typedArrayManager from '../utils/typed-array-manager';
 import deckGlobal from './init';
 
-import {getBrowser} from 'probe.gl/env';
+import {getBrowser} from '@probe.gl/env';
 import GL from '@luma.gl/constants';
 import {
   AnimationLoop,
@@ -41,7 +41,7 @@ import {
   Timeline,
   lumaStats
 } from '@luma.gl/core';
-import {Stats} from 'probe.gl';
+import {Stats} from '@probe.gl/stats';
 import {EventManager} from 'mjolnir.js';
 
 import assert from '../utils/assert';

modules/core/src/lib/init.js

@@ -21,18 +21,20 @@
 import {registerLoaders} from '@loaders.gl/core';
 import {ImageLoader} from '@loaders.gl/images';
 
-import {global} from 'probe.gl/env';
 import log from '../utils/log';
 import {register} from '../debug';
 import jsonLoader from '../utils/json-loader';
 
 // Version detection using babel plugin
 // Fallback for tests and SSR since global variable is defined by Webpack.
 const version =
-  typeof __VERSION__ !== 'undefined' ? __VERSION__ : global.DECK_VERSION || 'untranspiled source';
+  // @ts-expect-error
+  typeof __VERSION__ !== 'undefined'
+    ? __VERSION__
+    : globalThis.DECK_VERSION || 'untranspiled source';
 
 // Note: a `deck` object not created by deck.gl may exist in the global scope
-const existingVersion = global.deck && global.deck.VERSION;
+const existingVersion = globalThis.deck && globalThis.deck.VERSION;
 
 if (existingVersion && existingVersion !== version) {
   throw new Error(`deck.gl - multiple versions detected: ${existingVersion} vs ${version}`);
@@ -41,15 +43,16 @@ if (existingVersion && existingVersion !== version) {
 if (!existingVersion) {
   log.log(1, `deck.gl ${version}`)();
 
-  global.deck = Object.assign(global.deck || {}, {
+  globalThis.deck = {
+    ...globalThis.deck,
     VERSION: version,
     version,
     log,
     // experimental
     _registerLoggers: register
-  });
+  };
 
   registerLoaders([jsonLoader, [ImageLoader, {imagebitmap: {premultiplyAlpha: 'none'}}]]);
 }
 
-export default global.deck;
+export default globalThis.deck;

modules/core/src/lib/layer-manager.js

@@ -23,7 +23,7 @@ import {LIFECYCLE} from '../lifecycle/constants';
 import log from '../utils/log';
 import debug from '../debug';
 import {flatten} from '../utils/flatten';
-import {Stats} from 'probe.gl';
+import {Stats} from '@probe.gl/stats';
 import ResourceManager from './resource/resource-manager';
 
 import Viewport from '../viewports/viewport';

modules/core/src/utils/log.js

@@ -1,3 +1,3 @@
-import {Log} from 'probe.gl';
+import {Log} from '@probe.gl/log';
 
 export default new Log({id: 'deck'});

modules/extensions/bundle.js

@@ -1,8 +1,6 @@
 const Extensions = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/geo-layers/bundle.js

@@ -1,8 +1,6 @@
 const deckGLLayers = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.LineLayer) {

modules/google-maps/bundle.js

@@ -1,8 +1,6 @@
 const GoogleMapsUtils = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/json/bundle.js

@@ -1,8 +1,6 @@
 const JSONUtils = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/layers/bundle.js

@@ -1,8 +1,6 @@
 const deckGLLayers = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/mapbox/bundle.js

@@ -1,8 +1,6 @@
 const MapboxUtils = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/mesh-layers/bundle.js

@@ -1,8 +1,6 @@
 const deckGLLayers = require('./src');
 
-/* global window, global */
-const _global = typeof window === 'undefined' ? global : window;
-const deck = _global.deck || {};
+const deck = globalThis.deck || {};
 
 // Check if peer dependencies are included
 if (!deck.Layer) {

modules/test-utils/package.json

@@ -26,7 +26,7 @@
     "@deck.gl/core": "^8.0.0",
     "@luma.gl/test-utils": "^8.5.0",
     "@luma.gl/webgl": "^8.5.0",
-    "@probe.gl/test-utils": "^3.4.0"
+    "@probe.gl/test-utils": "3.5.0-alpha.4"
   },
   "scripts": {}
 }

modules/test-utils/src/utils/setup-gl.js

@@ -1,10 +1,7 @@
 import {createTestContext} from '@luma.gl/test-utils';
 
-/* global window, global*/
-const _global = typeof global !== 'undefined' ? global : window;
-
-_global.glContext =
-  _global.glContext ||
+globalThis.glContext =
+  globalThis.glContext ||
   createTestContext({
     width: 1,
     height: 1,
@@ -14,6 +11,6 @@ _global.glContext =
   });
 //   // TODO - Seems to be an issue in luma.gl
 //   (createContext && createContext(100, 100, {}));
-// // console.log('Context', _global.glContext);
+// // console.log('Context', globalThis.glContext);
 
-export default _global.glContext;
+export default globalThis.glContext;

package.json

@@ -53,8 +53,8 @@
     "@loaders.gl/csv": "^3.0.8",
     "@loaders.gl/polyfills": "^3.0.8",
     "@luma.gl/test-utils": "^8.5.10",
-    "@probe.gl/bench": "^3.4.0",
-    "@probe.gl/test-utils": "^3.4.0",
+    "@probe.gl/bench": "3.5.0-alpha.4",
+    "@probe.gl/test-utils": "3.5.0-alpha.4",
     "abortcontroller-polyfill": "^1.5.0",
     "babel-loader": "^8.0.0",
     "babel-plugin-inline-webgl-constants": "^1.0.3",

test/apps/json-layer/json-layer/json-layer.spec.js

@@ -53,17 +53,15 @@ test('JSONLayer#lifecycle', t => {
 
 test('JSONLayer#fetch', t => {
   // polyfill/hijack fetch
-  /* global global, window */
-  const _global = typeof global !== 'undefined' ? global : window;
-  const fetch = _global.fetch;
+  const fetch = globalThis.fetch;
 
   const data = {
     'data.json': JSON.stringify([{position: [-122.45, 37.8], text: 'Hello World'}]),
     'data.csv': `lon,lat,text
 -122.45,37.78,"Hello World"
 `
   };
-  _global.fetch = url =>
+  globalThis.fetch = url =>
     Promise.resolve({
       text: () => data[url]
     });
@@ -89,7 +87,7 @@ test('JSONLayer#fetch', t => {
   testInitializeLayer({layer: jsonLayer, onError: t.notOk});
 
   // Wait for fetch to resolve
-  _global.setTimeout(() => {
+  globalThis.setTimeout(() => {
     const subLayers = jsonLayer.renderLayers();
 
     t.deepEqual(
@@ -107,5 +105,5 @@ test('JSONLayer#fetch', t => {
   }, 0);
 
   // restore fetcch
-  _global.fetch = fetch;
+  globalThis.fetch = fetch;
 });