facebook / jsx

The JSX specification is a XML-like syntax extension to ECMAScript.
http://facebook.github.io/jsx/
1.96k stars 133 forks source link

Add JSXNamespacedName to object of JSXMemberExpression #54

Closed teppeis closed 8 years ago

teppeis commented 8 years ago

Following JSX makes JSXNamespacedName as an object of JSXMemberExpression.

<n:v.p />

https://astexplorer.net/#/Vy64XFydgx

      {
        "type": "JSXElement",
        "start": 0,
        "end": 14,
        "openingElement": {
          "type": "JSXOpeningElement",
          "start": 0,
          "end": 14,
          "attributes": [],
          "name": {
            "type": "JSXMemberExpression",
            "start": 1,
            "end": 11,
            "object": {
              "type": "JSXMemberExpression",
              "start": 1,
              "end": 8,
              "object": {
                "type": "JSXNamespacedName",
                "start": 1,
                "end": 5,
                "namespace": {
                  "type": "JSXIdentifier",
                  "start": 1,
                  "end": 2,
                  "name": "n"
                },
                "name": {
                  "type": "JSXIdentifier",
                  "start": 3,
                  "end": 5,
                  "name": "v1"
                }
              },
              "property": {
                "type": "JSXIdentifier",
                "start": 6,
                "end": 8,
                "name": "v2"
              }
            },
            "property": {
              "type": "JSXIdentifier",
              "start": 9,
              "end": 11,
              "name": "v3"
            }
          },
          "selfClosing": true
        },
        "closingElement": null,
        "children": []
      }
RReverser commented 8 years ago

AFAIK syntax spec doesn't allow such mix neither (intentionally), why do you think such AST would be valid?

sebmck commented 8 years ago

@RReverser See their link, it parses with acorn-jsx (and thus Babylon).

teppeis commented 8 years ago

Yeah, it seems to be invalid for JSX spec:

JSXElementName :

  • JSXIdentifier
  • JSXNamespacedName
  • JSXMemberExpression

JSXNamespacedName :

  • JSXIdentifier : JSXIdentifier

JSXMemberExpression :

  • JSXIdentifier . JSXIdentifier
  • JSXMemberExpression . JSXIdentifier

So, is it acorn-jsx's bug? Flow parser and TypeScript parser report syntax errors for it.

RReverser commented 8 years ago

See #13 for previous discussion. So basically we decided to support syntactic form that (React) JSX doesn't use, but in a wider form to cover more use cases (like mentioned internationalization, but also for member expressions).

teppeis commented 8 years ago

@RReverser Thanks. This should not be merged for consistency with the spec.

But the AST parsed by acorn-jsx is confusing. IMO, it's better for acorn-jsx to throw "Invalid syntax" for <n:v.p />, or to throw "JSXNamespacedName is not supported" for <n:v /> if it only supports a subset of spec.

Related: https://github.com/RReverser/acorn-jsx/issues/27