[BUG] SWC spans are broken with multi-byte offsets and accumulating offsets

[Yash-Singh1]

Describe the bug
A clear and concise description of what the bug is.

Multi-byte offsets

Currently, if you try to insert a multi-byte character in your code on AST Explorer, this eats up more space in the span.

This is related to the fact that the span values in SWC refer to byte positions instead of string indices: swc-project/swc#1366 (comment)

Code:

let a = {
  '❤️': 'hi'
}

console.log(a)

Reproducing:

• Type above code in SWC mode in the editor
• Reload (to reinitialize the parser)
• Try hovering over the ObjectExpression and notice how the span is offset by 3 extra characters

Accumalating Offsets

2024-01-15.15-08-36.mp4

The above issue is related to another bug in SWC that results in spans being accumalated. Internally this is done to get their sourcemap functionality working, but to workaround this, you will need to either:

• Store the offset of the Module or Script in a separate variable and subtract all other spans by that number. This will require AST Explorer to also calculate an extra span offset for header comments, because the span of the Module excludes any header offsets
• Reinitialize the parser every single time the user makes a change

Browser (please complete the following information):

• OS: mac
• Browser chrome
• Version 120

astexplorer settings:

• Selected parser: swc
• Selected transformer (if applicable): none
• Contents of the local storage key explorerSettingsV1 (code can be removed if you don't want it to be public)

{
  "showTransformPanel": false,
  "parserSettings": {
    "acorn": {
      "ecmaVersion": "latest",
      "sourceType": "script",
      "allowReserved": false,
      "allowReturnOutsideFunction": false,
      "allowImportExportEverywhere": false,
      "allowAwaitOutsideFunction": false,
      "allowHashBang": false,
      "locations": false,
      "loose": false,
      "ranges": false,
      "preserveParens": false,
      "plugins.jsx": true
    },
    "swc": { "syntax": "typescript", "jsx": false, "tsx": true }
  },
  "parserPerCategory": { "javascript": "swc" },
  "workbench": {
    "parser": "swc",
    "keyMap": "default",
    "transform": { "code": "", "transformer": null }
  }
}

Additional context
Add any other context about the problem here.

Related to swc-project/swc#1366

BTW thank you so much for making AST Explorer a thing, it helps me out a lot in my daily workflow :)

I can open up a PR to fix this if you want, bcuz I got these problems working in another project I am building that uses swc.