bug: Solid Start route files throw `Could not find element info.` for components

[JacobZwang]

Where the bug happens

• [ ] Browser Extension
• [X] Library
• [ ] Other

your browser

Chrome

Describe the bug

Components in the routes folder are properly tagged with data-locatorjs-id but are not stored correctly on window.__LOCATOR_DATA__. This means when you attempt to click on them you just get the error Could not find element info.. I did some digging and noticed that the route files seem to be registering themself twice, once semi-correctly, then once completely incorrectly, which overrides the semi-correct one. Not sure why this is.

import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/src/routes/test.tsx");import { shouldWarnAndDecline as _shouldWarnAndDecline } from "/@solid-refresh";
import { template as _$template } from "/node_modules/.vite/deps/solid-js_web.js?v=389b2f38";
import { getNextElement as _$getNextElement } from "/node_modules/.vite/deps/solid-js_web.js?v=389b2f38";
const _tmpl$ = /*#__PURE__*/_$template(`<div data-locatorjs-id="/Users/jacobzwang/Projects/redacted/src/routes/test.tsx::0">test</div>`, 2);
const test = props => {
  return _$getNextElement(_tmpl$);
};
export default test;
(() => {
  if (typeof window !== "undefined") {
    window.__LOCATOR_DATA__ = window.__LOCATOR_DATA__ || {};
    window.__LOCATOR_DATA__["/Users/jacobzwang/Projects/redacted/src/routes/test.tsx"] = {
      "filePath": "/src/routes/test.tsx",
      "projectPath": "/Users/jacobzwang/Projects/redacted",
      "expressions": [{
        "name": "div",
        "loc": {
          "start": {
            "line": 4,
            "column": 11,
            "index": 91
          },
          "end": {
            "line": 4,
            "column": 26,
            "index": 106
          }
        },
        "wrappingComponentId": 0
      }],
      "styledDefinitions": [],
      "components": []
    };
  }
})();
if (_shouldWarnAndDecline()) if (import.meta.hot) import.meta.hot.decline();
(() => {
  if (typeof window !== "undefined") {
    window.__LOCATOR_DATA__ = window.__LOCATOR_DATA__ || {};
    window.__LOCATOR_DATA__["/Users/jacobzwang/Projects/redacted/src/routes/test.tsx"] = {
      "filePath": "/src/routes/test.tsx",
      "projectPath": "/Users/jacobzwang/Projects/redacted",
      "expressions": [],
      "styledDefinitions": [],
      "components": []
    };
  }
})();

To reproduce

Create a solid start project and add the Vite extension. Using the chrome extension, try clicking on a component and see that it doesn't work.

✔ Which template do you want to use? › bare
✔ Server Side Rendering? … yes
✔ Use TypeScript? … yes

import solid from "solid-start/vite";
import { defineConfig } from "vite";

export default defineConfig({
    plugins: [
        solid({
            babel: {
                plugins: [
                    [
                        "@locator/babel-jsx/dist",
                        {
                            env: "development",
                        },
                    ],
                ],
            },
        }),
    ],
});

Additional information

No response

[JacobZwang]

Noticed this related PR Fix __LOCATOR_DATA__ being overriden #90

[JacobZwang]

Note, I just tried creating a bare project without typescript and still had the same issue.