More accurate source locations for JSX opening/closing tags
<img width="553" alt="Screenshot 2024-03-19 at 4 41 15 PM" src="https://github.com/facebook/react-forget/assets/6425824/e87ee704-6c67-4e10-824b-71e97e7e19f5"> Slightly improves source locations for JSX elements so that the opening and closing tag have distinct locations that match up with source. The identifier itself within the closing tag still has the wrong location, but at least this is an improvement. Doesn't fix the fbt thing but it was worth a try.
Joe Savona committed
Mar 19, 2024 at 16:26 UTC
f2b0b656b255fbf9efaf12c316988ff8a34332a2
3 files changed
+14
-3
compiler/packages/babel-plugin-react-forget/src/HIR/BuildHIR.ts
+4
-1
@@ -1967,6 +1967,7 @@ function lowerExpression(
1967
case "JSXElement": {
1968
const expr = exprPath as NodePath<t.JSXElement>;
1969
const opening = expr.get("openingElement");
1970
+ const openingLoc = opening.node.loc ?? GeneratedSource;
1971
const tag = lowerJsxElementName(builder, opening.get("name"));
1972
const props: Array<JsxAttribute> = [];
1973
for (const attribute of opening.get("attributes")) {
@@ -2073,7 +2074,7 @@ function lowerExpression(
2074
return lowerValueToTemporary(builder, {
2075
kind: "JSXText",
2076
value: text,
2076
- loc: exprLoc,
2077
+ loc: child.node.loc ?? GeneratedSource,
2078
});
2079
}
2080
return lowerJsxElement(builder, child);
@@ -2091,6 +2092,8 @@ function lowerExpression(
2092
props,
2093
children: children.length === 0 ? null : children,
2094
loc: exprLoc,
2095
+ openingLoc: openingLoc,
2096
+ closingLoc: expr.get("closingElement").node?.loc ?? GeneratedSource,
2097
};
2098
}
2099
case "JSXFragment": {
compiler/packages/babel-plugin-react-forget/src/HIR/HIR.ts
+2
@@ -795,6 +795,8 @@ export type InstructionValue =
795
props: Array<JsxAttribute>;
796
children: Array<Place> | null; // null === no children
797
loc: SourceLocation;
798
+ openingLoc: SourceLocation;
799
+ closingLoc: SourceLocation;
800
}
801
| {
802
kind: "ObjectExpression";
compiler/packages/babel-plugin-react-forget/src/ReactiveScopes/CodegenReactiveFunction.ts
+8
-2
@@ -1089,6 +1089,7 @@ const createJsxIdentifier = withLoc(t.jsxIdentifier);
1089
const createJsxExpressionContainer = withLoc(t.jsxExpressionContainer);
1090
const createJsxText = withLoc(t.jsxText);
1091
const createJsxClosingElement = withLoc(t.jsxClosingElement);
1092
+const createJsxOpeningElement = withLoc(t.jsxOpeningElement);
1093
const createStringLiteral = withLoc(t.stringLiteral);
1094
1095
function createHookGuard(
@@ -1515,9 +1516,14 @@ function codegenInstructionValue(
1516
}
1517
value = createJsxElement(
1518
instrValue.loc,
1518
- t.jsxOpeningElement(tag, attributes, instrValue.children === null),
1519
+ createJsxOpeningElement(
1520
+ instrValue.openingLoc,
1521
+ tag,
1522
+ attributes,
1523
+ instrValue.children === null
1524
+ ),
1525
instrValue.children !== null
1520
- ? createJsxClosingElement(instrValue.tag.loc, tag)
1526
+ ? createJsxClosingElement(instrValue.closingLoc, tag)
1527
: null,
1528
children,
1529
instrValue.children === null