Merge pull request #31 from alexzhang1030/master

fix: windows platform path error && remove rendundancy code

.changeset/breezy-phones-occur.md

@@ -0,0 +1,5 @@
+---
+"vite-plugin-react-inspector": patch
+---
+
+fix: fix windows platform path error && remove rendundancy code

packages/vite-plugin-react-inspector/src/index.ts

@@ -2,7 +2,7 @@ import type { Connect, Plugin } from 'vite'
 import { parseSync, traverse } from '@babel/core'
 import MagicString from 'magic-string'
 import { queryParserMiddleware } from './middleware'
-import { parseJSXIdentifier } from './utils'
+import { parseFilePath, parseJSXIdentifier } from './utils'
 import { launchEditor } from './launch-editor'
 function VitePluginReactInspector(): Plugin {
   return {
@@ -60,14 +60,11 @@ function VitePluginReactInspector(): Plugin {
         if (req.url?.startsWith('/__react-inspector-launch-editor')) {
           const { file } = req?.query as any
           if (file) {
-            const [filePath, line, column] = file.split(':')
+            const [filePath, line, column] = parseFilePath(file)
             launchEditor(filePath, Number(line), Number(column))
           }
-          next()
-        }
-        else {
-          next()
         }
+        next()
       })
     },
     transformIndexHtml(html) {

packages/vite-plugin-react-inspector/src/utils/index.ts

@@ -7,3 +7,19 @@ export function parseJSXIdentifier(name: JSXIdentifier | JSXMemberExpression) {
   else
     return `${parseJSXIdentifier(name.object)}.${parseJSXIdentifier(name.property)}`
 }
+
+/**
+ * Because win platform path scheme is D:/xxx
+ * So if we wanna get the col and row number, cannot just `const [fileName, col, row] = filePath.split(':')`
+ * We can use split, and the last two are col and row, then splice rest part
+ *
+ * @param {string} filePath full filePath including filename col and row
+ * @return {[string, string, string]} [fileName, row, col]
+ */
+export function parseFilePath(filePath: string): [string, string, string] {
+  const splitPath = filePath.split(':')
+  const fileName = splitPath.splice(0, splitPath.length - 2).join(':')
+  const row = splitPath[splitPath.length - 2]
+  const col = splitPath[splitPath.length - 1]
+  return [fileName, row, col]
+}

packages/vite-plugin-react-inspector/test/index.test.ts

@@ -1,6 +1,16 @@
 import { describe, expect, it } from 'vitest'
+import { parseFilePath } from '../src/utils'
 describe('should', () => {
   it('exported', () => {
     expect(1).toEqual(1)
   })
 })
+
+it('multiple platforms path splice test', () => {
+  const OSX = '/Users/user/Desktop/test/test.jsx:1:1'
+  expect(parseFilePath(OSX)).toEqual(['/Users/user/Desktop/test/test.jsx', '1', '1'])
+  const WINDOWS = 'D:/test/test.jsx:1:1'
+  expect(parseFilePath(WINDOWS)).toEqual(['D:/test/test.jsx', '1', '1'])
+  const LINUX = '/Users/user/Desktop/test/test.jsx:1:1'
+  expect(parseFilePath(LINUX)).toEqual(['/Users/user/Desktop/test/test.jsx', '1', '1'])
+})