React StrictMode: Error after upgrading can't access property "maxTextureDimension2D", this.device.limits is undefined

[borjaevo]

I was using deck.gl in my react application and I have upgraded to 9.2.2. After upgrading, this error is shown.
Error after upgrading can't access property "maxTextureDimension2D", this.device.limits is undefined

Not sure how can i solve it.
Thanks

[DedaDev]

same... I've just copied the reverse example from here
this is the stack:

chunk-LCV5T5HY.js?v=af805b95:1995 Uncaught TypeError: Cannot read properties of undefined (reading 'maxTextureDimension2D')
    at WebGLCanvasContext.getMaxDrawingBufferSize (chunk-LCV5T5HY.js?v=af805b95:1995:52)
    at WebGLCanvasContext._handleResize (chunk-LCV5T5HY.js?v=af805b95:2085:62)
    at ResizeObserver.<anonymous> (chunk-LCV5T5HY.js?v=af805b95:1938:67)

edit: i've also downgraded to 9.0.0 - error is still there
I think this line is causing a problem, because deviceProps are not provided,

[ibgreen]

This works for me, save this to index.html and then open index.html or load it in the browser in some other way. It looks like the script version needs to wait for the page to be loaded, so I added that.

Can't reproduce the error you are seeing

<script src="https://unpkg.com/deck.gl@^9.0.0/dist.min.js"></script>
<script src="https://unpkg.com/maplibre-gl@^4.0.0/dist/maplibre-gl.js"></script>
<link href="https://unpkg.com/maplibre-gl@^4.0.0/dist/maplibre-gl.css" rel="stylesheet" />
<script type="text/javascript">
  const {DeckGL, ScatterplotLayer} = deck;

  console.log(deck.VERSION);

document.addEventListener("DOMContentLoaded", (event) => {
  new DeckGL({
    mapStyle: 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json',
    initialViewState: {
      longitude: 0.45,
      latitude: 51.47,
      zoom: 11
    },
    controller: true,
    layers: [
      new ScatterplotLayer({
        id: 'deckgl-circle',
        data: [
          {position: [0.45, 51.47]}
        ],
        getPosition: d => d.position,
        getFillColor: [255, 0, 0, 100],
        getRadius: 1000
      })
    ]
  });
});
</script>

[DedaDev]

try it with the example that I linked (react version)

[kaankoroglu]

I have the same issue after moving from 9.1.9 to 9.2.2

[yavuzgunes]

I have the same issue. I can't go back to previous version since I have used widgets from the new version. Is there a solution available?

[matt-chaib]

I had this issue also in my React app. What fixed it for me was removing the React.StrictMode tags in my app.jsx page. Hopefully that helps the maintainers debug this.

[ibgreen]

Thats a good clue, thanks.
The double initialization from StrictMode probably causes the device to be invalid somehow.

[jbeno]

Ran into this same issue:

Cannot read properties of undefined (reading 'maxTextureDimension2D')

My app's using:

• @deck.gl/core: 9.2.2
• @deck.gl/layers: 9.2.2
• @deck.gl/react: 9.2.2
• @luma.gl/core: 9.2.4 (transitive)
• @luma.gl/engine: 9.2.4 (transitive)
• @luma.gl/webgl: 9.2.4 (transitive)
• react: 19.1.1
• react-dom: 19.1.1
• next: 15.5.3

Disabling reactStrictMode in next.config.js eliminated the error for me as well.

Is there an issue tracking this?

[fcrisafulli-dev]

We ran into the same issue as well:

//package.json

"@deck.gl/core": "9.2.2",
"@deck.gl/extensions": "9.2.2",
"@deck.gl/geo-layers": "9.2.2",
"@deck.gl/layers": "9.2.2",
"@deck.gl/mapbox": "9.2.2",
"@deck.gl/react": "9.2.2",
"@deck.gl/widgets": "9.2.2",

import React from "react"
import { DeckGL } from "@deck.gl/react"
import { Map } from "react-map-gl/maplibre"
import { MapViewState } from "@deck.gl/core"

const INITIAL_VIEW_STATE: MapViewState = {
  longitude: -122.41669,
  latitude: 37.7853,
  zoom: 13,
}

export default function DeckGLMap() {
  return (
    <DeckGL
      id="deck-gl"
      initialViewState={INITIAL_VIEW_STATE}
      controller={{ doubleClickZoom: false }}
    >
      <Map
        mapStyle={
          "https://roblabs.com/xyz-raster-sources/styles/arcgis-world-imagery.json"
        }
        attributionControl={false}
      ></Map>
    </DeckGL>
  )
}

same issue with a simpler example as well

import React from "react"
import { DeckGL } from "@deck.gl/react"
import { TextLayer } from "@deck.gl/layers"

export default function DeckGLMap() {
  const layers = [
    new TextLayer({
      id: "text-layer",
      data: [
        {
          text: "Hello, world!",
          x: 0,
          y: 0,
        },
      ],
    }),
  ]
  return <DeckGL layers={layers} />
}
  

We are using NextJs 15, disabling reactStrictMode in next.config.ts also makes the error go away.

I will also note I tested the same code in TanstackStart React and got the error there too

I do not get the error with the html ibgreen posted, so it might be a React specific issue?