test: add test cases for AST node expansion and interactions

[lumirlumir]

Prerequisites checklist

• I have read the contributing guidelines.

AI acknowledgment

• I did not use AI to generate this PR.
• (If the above is not checked) I have reviewed the AI-generated content before submitting.

What is the purpose of this pull request?

This PR adds AST node expansion tests for various parser options, such as Markdown frontmatter and math, as well as the JSON allowTrailingCommas option.

Since these end-to-end test cases cover the full range of AST interactions across different languages, the amount of code added is a bit large. However, that was the original purpose of #64 (comment), so I think it’s worth adding.

What changes did you make? (Give an overview)

Added test cases for:

• JavaScript
• JSON
• Markdown
• CSS
• HTML

Also, I’ve divided the section using test.describe to make it clearer how the tests are partitioned and structured.

Related Issues

N/A

Is there anything you'd like reviewers to focus on?

N/A

[netlify]

✅ Deploy Preview for eslint-code-explorer ready!

Name	Link
🔨 Latest commit	64cec60
🔍 Latest deploy log	https://app.netlify.com/projects/eslint-code-explorer/deploys/6a5dac9016a10500082998f7
😎 Deploy Preview	https://deploy-preview-398--eslint-code-explorer.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Copilot]

Pull request overview

Adds end-to-end Playwright tests for AST node expansion across multiple language parser options (JavaScript, JSON, Markdown, CSS, HTML), structured into test.describe blocks for clarity.

Changes:

• Adds an AST node expansion describe block covering JavaScript source types, ECMAScript version, and JSX.
• Adds JSON tests for JSON/JSONC/JSON5 modes and Allow Trailing Commas option.
• Adds Markdown (CommonMark/GFM, frontmatter variants, math), CSS (tolerant parsing), and HTML (template engine syntax, front matter) tests.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[DMartens]

Two optional suggestions:

1. Every test case has the same structure: set option, set input, validate AST. It would be great if that would be abstracted into a function, e.g. checkLanguage({ language: 'JavaScript', options: [{ sourceType: 'module' }], code: 'import "mod"', ast: { ... }). A smaller variant of this suggestion is to add a helper setOption which abstracts opening, setting the option and closing the popup.
2. I think checking the text of the AST nodes is too brittle and should be done by using the JSON text from codemirror (I think one test case only checking the rendering of the AST in tree form would be enough)

[github-actions]

Hi everyone, it looks like we lost track of this pull request. Please review and see what the next steps are. This pull request will auto-close in 7 days without an update.

[lumirlumir]

Every test case has the same structure: set option, set input, validate AST. It would be great if that would be abstracted into a function, e.g. checkLanguage({ language: 'JavaScript', options: [{ sourceType: 'module' }], code: 'import "mod"', ast: { ... }). A smaller variant of this suggestion is to add a helper setOption which abstracts opening, setting the option and closing the popup.

Sounds good to me. I took the smaller approach and added setComboboxOption and setSwitchOption to reduce duplication. Updated it in 0cb8efd

I think checking the text of the AST nodes is too brittle and should be done by using the JSON text from codemirror (I think one test case only checking the rendering of the AST in tree form would be enough)

I initially tried using the JSON displayed in CodeMirror, but it made the tests more brittle. CodeMirror only renders the current viewport and a small margin to the DOM, so reading the complete JSON would require repeatedly scrolling and combining the rendered content. This makes the tests more complex and unstable, so I’d prefer to retain the current approach.

[DMartens]

Setting options may should be abstracted more by introducing an additional helper setOptions which abstracts setting the options and pressing Escape after:

await setOptions(page, [
	{ role: 'combobox', name: 'Mode', value: 'CommonMark' },
	{ role: 'combobox', name: 'Front Matter', value: 'Off' },
	{ role: 'switch', name: 'Math', value: false },
])

[DMartens]

When I suggested using the JSON, I tried a naive .textContent on the JSON view of the AST and it works.
It returns the whole content as a string, so it has to passed to JSON.parse to get an object.

[lumirlumir]

When I suggested using the JSON, I tried a naive .textContent on the JSON view of the AST and it works.
It returns the whole content as a string, so it has to passed to JSON.parse to get an object.

@DMartens Can you clarify your suggestion with correctly working e2e test examples? Accessing textContent still has the problem I mentioned above.