@@ -16,12 +16,24 @@ const ERROR_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="tru
1616
1717const HINT_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="24" height="24" fill="none"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m21 2-1 1M3 2l1 1m17 13-1-1M3 16l1-1m5 3h6m-5 3h4M12 3C8 3 5.952 4.95 6 8c.023 1.487.5 2.5 1.5 3.5S9 13 9 15h6c0-2 .5-2.5 1.5-3.5h0c1-1 1.477-2.013 1.5-3.5.048-3.05-2-5-6-5Z"/></svg>`
1818
19+ const COPY_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="16" height="16" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2m8 0V2a2 2 0 0 0-2-2H10a2 2 0 0 0-2 2v2m8 0H8"/></svg>`
20+
21+ function htmlAttributeEscape ( value : string ) : string {
22+ return value
23+ . replace ( / & / g, '&' )
24+ . replace ( / " / g, '"' )
25+ . replace ( / ' / g, ''' )
26+ . replace ( / < / g, '<' )
27+ . replace ( / > / g, '>' )
28+ }
29+
1930/**
2031 * Displays the error info including the response status text,
2132 * error name, error message and the hint.
2233 */
2334export class ErrorInfo extends BaseComponent < ErrorInfoProps > {
2435 cssFile = new URL ( './error_info/style.css' , publicDirURL )
36+ jsFile = new URL ( './error_info/script.js' , publicDirURL )
2537
2638 /**
2739 * The toHTML method is used to output the HTML for the
@@ -38,6 +50,15 @@ export class ErrorInfo extends BaseComponent<ErrorInfoProps> {
3850 <h2 id="error-message">
3951 <span>${ ERROR_ICON_SVG } </span>
4052 <span>${ props . error . message } </span>
53+ <button
54+ id="copy-error-btn"
55+ data-error-text="${ htmlAttributeEscape ( `${ props . error . name } : ${ props . error . message } ` ) } "
56+ onclick="copyErrorMessage(this)"
57+ title="Copy error message"
58+ aria-label="Copy error message to clipboard"
59+ >
60+ ${ COPY_ICON_SVG }
61+ </button>
4162 </h2>
4263 ${
4364 props . error . hint
0 commit comments