Devtools break with instance using custom renderer TresJS (no DOM)

[alvarosabu]

Vue devtools version

6.5.0

Link to minimal reproduction

https://stackblitzstarterssa3ruk-5dvj--5173--77657b1e.local-credentialless.webcontainer.io/

Steps to reproduce & screenshots

1. Open the link

2. Open devtools
   

3. See error on console.
   

What is expected?

I would expect that the vue renderer continues working at least so users can continue using devtools while adding TresJS and 3D to their projects.

Since is probably because the dev tools were not conceived for renderers outside the DOM context (ThreeJS scene objects in this case) I'm not expecting it shows the TresJS components but at least it doesn't break the vue wrapper devtools (App1)

What is actually happening?

When backend.api.getComponentRootElements(rootInstance); is called for the second instance (TresApp), there are no DOM root elements, so el is undefined making the el.ownerDocument condition break.

  iframe: shared_utils_1.isBrowser && document !== el.ownerDocument ? (_b = (_a = el.ownerDocument) === null || _a === void 0 ? void 0 : _a.location) === null || _b === void 0 ? void 0 : _b.pathname : null,

Job regiserApp failed:

TypeError: Cannot read properties of undefined (reading 'ownerDocument')
    at createAppRecord 

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
  npmPackages:
    vue: ^3.3.4 => 3.3.4 

### Any additional comments?

I appreciate the support for the Tres ecosystem 🙏🏻

[Azurewarth0920]

Will be fixed by #2092