mirror of
https://github.com/microsoft/playwright.git
synced 2025-06-26 21:40:17 +00:00
c8134bca5d
Drive-by: - extract `TestErrorView`; - replace `data-test-id` with `data-testid` and `getByTestId()`. --- <img width="1001" alt="top-level errors in html report" src="https://github.com/microsoft/playwright/assets/9881434/2d6c0c52-8df1-46a9-b3fd-06ddc6f16796">
57 lines
1.5 KiB
TypeScript
57 lines
1.5 KiB
TypeScript
/*
|
|
Copyright (c) Microsoft Corporation.
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
*/
|
|
|
|
import ansi2html from 'ansi-to-html';
|
|
import * as React from 'react';
|
|
import './testErrorView.css';
|
|
|
|
export const TestErrorView: React.FC<{
|
|
error: string;
|
|
}> = ({ error }) => {
|
|
const html = React.useMemo(() => {
|
|
const config: any = {
|
|
bg: 'var(--color-canvas-subtle)',
|
|
fg: 'var(--color-fg-default)',
|
|
};
|
|
config.colors = ansiColors;
|
|
return new ansi2html(config).toHtml(escapeHTML(error));
|
|
}, [error]);
|
|
return <div className='test-error-message' dangerouslySetInnerHTML={{ __html: html || '' }}></div>;
|
|
};
|
|
|
|
const ansiColors = {
|
|
0: '#000',
|
|
1: '#C00',
|
|
2: '#0C0',
|
|
3: '#C50',
|
|
4: '#00C',
|
|
5: '#C0C',
|
|
6: '#0CC',
|
|
7: '#CCC',
|
|
8: '#555',
|
|
9: '#F55',
|
|
10: '#5F5',
|
|
11: '#FF5',
|
|
12: '#55F',
|
|
13: '#F5F',
|
|
14: '#5FF',
|
|
15: '#FFF'
|
|
};
|
|
|
|
function escapeHTML(text: string): string {
|
|
return text.replace(/[&"<>]/g, c => ({ '&': '&', '"': '"', '<': '<', '>': '>' }[c]!));
|
|
}
|