TSX Sourcemaps

.changeset/twelve-waves-help.md

@@ -0,0 +1,5 @@
+---
+'@astrojs/compiler': minor
+---
+
+Improve sourcemap support for TSX output

.github/workflows/ci.yml

@@ -2,9 +2,9 @@ name: Test
 
 on:
   push:
-    branches: ['main', 'next']
+    branches: ["main", "next"]
   pull_request:
-    branches: ['main', 'next']
+    branches: ["main", "next"]
 
 # Automatically cancel in-progress actions on the same branch
 concurrency:
@@ -26,7 +26,10 @@ jobs:
         run: go test -v ./internal/...
 
   test-wasm:
-    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        OS: [ubuntu-latest, windows-latest]
+    runs-on: ${{ matrix.OS }}
     steps:
       - uses: actions/checkout@v2
 
@@ -42,7 +45,7 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: 14
-          cache: 'pnpm'
+          cache: "pnpm"
 
       - name: Build WASM
         run: make wasm
@@ -75,6 +78,6 @@ jobs:
       - uses: actions/setup-node@v2
         with:
           node-version: 14
-          cache: 'pnpm'
+          cache: "pnpm"
       - run: pnpm install
       - run: pnpm run lint

.gitignore

@@ -4,3 +4,4 @@ node_modules
 *.wasm
 /astro
 debug.test
+packages/compiler/sourcemap.mjs

cmd/astro-wasm/astro-wasm.go

@@ -223,9 +223,16 @@ func ConvertToTSX() interface{} {
 		}
 		result := printer.PrintToTSX(source, doc, transformOptions)
 
+		sourcemapString := createSourceMapString(source, result, transformOptions)
+		code := string(result.Output)
+		if transformOptions.SourceMap != "external" {
+			inlineSourcemap := `//# sourceMappingURL=data:application/json;charset=utf-8;base64,` + base64.StdEncoding.EncodeToString([]byte(sourcemapString))
+			code += "\n" + inlineSourcemap
+		}
+
 		return vert.ValueOf(TSXResult{
-			Code: string(result.Output),
-			Map:  createSourceMapString(source, result, transformOptions),
+			Code: code,
+			Map:  sourcemapString,
 		})
 	})
 }
@@ -328,7 +335,7 @@ func Transform() interface{} {
 									output = append(output, []byte(strings.TrimSpace(node.FirstChild.Data))...)
 								}
 								sourcemap := fmt.Sprintf(
-									`{ "version": 3, "sources": ["%s"], "sourcesContent": [%s], "mappings": "%s", "names": [] }`,
+									`{ "version": 3, "sources": ["%s", "astro:runtime"], "sourcesContent": [%s, "Please open an issue: https://astro.build/issues"], "mappings": "%s", "names": [] }`,
 									transformOptions.Filename,
 									string(sourcesContent),
 									string(builder.GenerateChunk(output).Buffer),
@@ -408,8 +415,8 @@ func createSourceMapString(source string, result printer.PrintResult, transformO
 	}
 	return fmt.Sprintf(`{
   "version": 3,
-  "sources": ["%s"],
-  "sourcesContent": [%s],
+  "sources": ["%s", "astro:runtime"],
+  "sourcesContent": [%s, "Please open an issue: https://astro.build/issues"],
   "mappings": "%s",
   "names": []
 }`, sourcemap.Sources[0], sourcemap.SourcesContent[0], sourcemap.Mappings)

internal/js_scanner/js_scanner.go

@@ -4,6 +4,7 @@ import (
 	"bytes"
 	"fmt"
 	"io"
+	"strings"
 
 	"github.com/iancoleman/strcase"
 	"github.com/tdewolff/parse/v2"
@@ -179,6 +180,162 @@ func HoistImports(source []byte) HoistedScripts {
 	return HoistedScripts{Hoisted: imports, Body: body}
 }
 
+type Props struct {
+	Ident     string
+	Statement string
+	Generics  string
+}
+
+func GetPropsType(source []byte) Props {
+	defaultPropType := "Record<string, any>"
+	ident := defaultPropType
+	genericsIdents := make([]string, 0)
+	generics := ""
+	statement := ""
+
+	if !bytes.Contains(source, []byte("Props")) {
+		return Props{
+			Ident:     ident,
+			Statement: statement,
+			Generics:  generics,
+		}
+	}
+	l := js.NewLexer(parse.NewInputBytes(source))
+	i := 0
+	pairs := make(map[byte]int)
+	idents := make([]string, 0)
+
+	start := 0
+	end := 0
+
+outer:
+	for {
+		token, value := l.Next()
+
+		if token == js.DivToken || token == js.DivEqToken {
+			lns := bytes.Split(source[i+1:], []byte{'\n'})
+			if bytes.Contains(lns[0], []byte{'/'}) {
+				token, value = l.RegExp()
+			}
+		}
+
+		if token == js.ErrorToken {
+			if l.Err() != io.EOF {
+				return Props{
+					Ident: ident,
+				}
+			}
+			break
+		}
+
+		// Common delimeters. Track their length, then skip.
+		if token == js.WhitespaceToken || token == js.LineTerminatorToken || token == js.SemicolonToken {
+			i += len(value)
+			continue
+		}
+
+		if token == js.ExtendsToken {
+			if bytes.Equal(value, []byte("extends")) {
+				idents = append(idents, "extends")
+			}
+			i += len(value)
+			continue
+		}
+
+		if pairs['{'] == 0 && pairs['('] == 0 && pairs['['] == 0 && pairs['<'] == 1 && token == js.CommaToken {
+			idents = make([]string, 0)
+			i += len(value)
+			continue
+		}
+
+		if js.IsIdentifier(token) {
+			if isKeyword(value) {
+				i += len(value)
+				continue
+			}
+			if pairs['<'] == 1 && pairs['{'] == 0 {
+				foundExtends := false
+				for _, id := range idents {
+					if id == "extends" {
+						foundExtends = true
+					}
+				}
+				if !foundExtends {
+					genericsIdents = append(genericsIdents, string(value))
+				}
+				i += len(value)
+				continue
+			}
+			// Note: do not check that `pairs['{'] == 0` to support named imports
+			if pairs['('] == 0 && pairs['['] == 0 && string(value) == "Props" {
+				ident = "Props"
+			}
+			idents = append(idents, string(value))
+			i += len(value)
+			continue
+		}
+
+		if bytes.ContainsAny(value, "<>") {
+			if len(idents) > 0 && idents[len(idents)-1] == "Props" {
+				start = i
+				ident = "Props"
+				idents = make([]string, 0)
+			}
+			for _, c := range value {
+				if c == '<' {
+					pairs['<']++
+					i += len(value)
+					continue
+				}
+				if c == '>' {
+					pairs['<']--
+					if pairs['<'] == 0 {
+						end = i
+						break outer
+					}
+				}
+			}
+		}
+
+		if token == js.QuestionToken || (pairs['{'] == 0 && token == js.ColonToken) {
+			idents = make([]string, 0)
+			idents = append(idents, "extends")
+		}
+
+		// Track opening and closing braces
+		if js.IsPunctuator(token) {
+			if value[0] == '{' || value[0] == '(' || value[0] == '[' {
+				idents = make([]string, 0)
+				pairs[value[0]]++
+				i += len(value)
+				continue
+			} else if value[0] == '}' {
+				pairs['{']--
+				if pairs['<'] == 0 && pairs['{'] == 0 && ident != defaultPropType {
+					end = i
+					break outer
+				}
+			} else if value[0] == ')' {
+				pairs['(']--
+			} else if value[0] == ']' {
+				pairs['[']--
+			}
+		}
+
+		// Track our current position
+		i += len(value)
+	}
+	if len(genericsIdents) > 0 && ident != defaultPropType {
+		generics = fmt.Sprintf("<%s>", strings.Join(genericsIdents, ", "))
+		statement = strings.TrimSpace(string(source[start:end]))
+	}
+	return Props{
+		Ident:     ident,
+		Statement: statement,
+		Generics:  generics,
+	}
+}
+
 func isIdentifier(value []byte) bool {
 	valid := true
 	for i, b := range value {

internal/printer/print-to-js.go

@@ -105,6 +105,7 @@ func render1(p *printer, n *Node, opts RenderOptions) {
 
 	// Root of the document, print all children
 	if n.Type == DocumentNode {
+		p.addNilSourceMapping()
 		p.printInternalImports(p.opts.InternalURL)
 		if opts.opts.StaticExtraction && n.FirstChild != nil && n.FirstChild.Type != FrontmatterNode {
 			p.printCSSImports(opts.cssLen)
@@ -134,6 +135,7 @@ func render1(p *printer, n *Node, opts RenderOptions) {
 
 		for c := n.FirstChild; c != nil; c = c.NextSibling {
 			if c.Type == TextNode {
+				p.addNilSourceMapping()
 				p.printInternalImports(p.opts.InternalURL)
 
 				if len(n.Loc) > 0 {