Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-30 22:03:56 -05:00
Code Issues Activity

Fix CSS error line offset (#7491)

Browse source
This commit is contained in:
Bjorn Lu 2023-06-27 21:16:43 +08:00 committed by GitHub
parent 6dfd7081b7
commit a3928016cc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 34 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/perfect-moose-end.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fix CSS error line offset

17
packages/astro/e2e/errors.test.js
View file

@ -81,6 +81,23 @@ test.describe('Error display', () => {
expect(fileLocation).toMatch(/^components\/PreactRuntimeError.jsx/);
});
test('shows correct line when a style preprocess has an error', async ({ page, astro }) => {
await page.goto(astro.resolveUrl('/astro-sass-error'), { waitUntil: 'networkidle' });
const { fileLocation, absoluteFileLocation } = await getErrorOverlayContent(page);
const absoluteFileUrl = 'file://' + absoluteFileLocation.replace(/:\d+:\d+$/, '');
const fileExists = astro.pathExists(absoluteFileUrl);
expect(fileExists).toBeTruthy();
const fileContent = await astro.readFile(absoluteFileUrl);
const lineNumber = absoluteFileLocation.match(/:(\d+):\d+$/)[1];
const highlightedLine = fileContent.split('\n')[lineNumber - 1];
expect(highlightedLine).toContain(`@use '../styles/inexistent' as *;`);
expect(fileLocation).toMatch(/^pages\/astro-sass-error.astro/);
});
test('framework errors recover when fixed', async ({ page, astro }) => {
await page.goto(astro.resolveUrl('/svelte-syntax-error'), { waitUntil: 'networkidle' });

1
packages/astro/e2e/fixtures/errors/package.json
View file

@ -12,6 +12,7 @@
"preact": "^10.15.1",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"sass": "^1.63.4",
"solid-js": "^1.7.6",
"svelte": "^3.59.1",
"vue": "^3.3.4"

5
packages/astro/e2e/fixtures/errors/src/pages/astro-sass-error.astro Normal file
View file

@ -0,0 +1,5 @@
<h1>test</h1>
<style lang="scss">
@use '../styles/inexistent' as *;
</style>

6
packages/astro/src/core/compile/style.ts
View file

@ -36,7 +36,7 @@ export function createStylePreprocessor({
return { code: result.code, map };
} catch (err: any) {
try {
err = enhanceCSSError(err, filename);
err = enhanceCSSError(err, filename, content);
} catch {}
cssTransformErrors.push(err);
return { error: err + '' };
@ -44,9 +44,9 @@ export function createStylePreprocessor({
};
}
function enhanceCSSError(err: any, filename: string) {
function enhanceCSSError(err: any, filename: string, cssContent: string) {
const fileContent = fs.readFileSync(filename).toString();
const styleTagBeginning = fileContent.indexOf(err.input?.source ?? err.code);
const styleTagBeginning = fileContent.indexOf(cssContent);
// PostCSS Syntax Error
if (err.name === 'CssSyntaxError') {

7
pnpm-lock.yaml
View file

@ -968,6 +968,9 @@ importers:
react-dom:
specifier: ^18.1.0
version: 18.2.0(react@18.2.0)
sass:
specifier: ^1.63.4
version: 1.63.4
solid-js:
specifier: ^1.7.6
version: 1.7.6
@ -18112,25 +18115,21 @@ packages:
file:packages/astro/test/fixtures/css-assets/packages/font-awesome:
resolution: {directory: packages/astro/test/fixtures/css-assets/packages/font-awesome, type: directory}
name: '@test/astro-font-awesome-package'
version: 0.0.1
dev: false
file:packages/astro/test/fixtures/multiple-renderers/renderers/one:
resolution: {directory: packages/astro/test/fixtures/multiple-renderers/renderers/one, type: directory}
name: '@test/astro-renderer-one'
version: 1.0.0
dev: false
file:packages/astro/test/fixtures/multiple-renderers/renderers/two:
resolution: {directory: packages/astro/test/fixtures/multiple-renderers/renderers/two, type: directory}
name: '@test/astro-renderer-two'
version: 1.0.0
dev: false
file:packages/astro/test/fixtures/solid-component/deps/solid-jsx-component:
resolution: {directory: packages/astro/test/fixtures/solid-component/deps/solid-jsx-component, type: directory}
name: '@test/solid-jsx-component'
version: 0.0.0
dependencies:
solid-js: 1.7.6
dev: false