Bad request instead of an actual error if error message contains html tags

[timfursov]

Bug description

When creating a chart, if error massage contains html tag, Unexpected error Bad request is shown instead of an actual error.
However api/v1/chart/data responds with the full error text in message which makes me think that it has something to do with the ui trying to prevent XSS attacks.
I tried to play with HTML_SANITIZATION but it seems that nothing changes.

How to reproduce

1. Create a new chart
2. Create a custom metric with <a> in the expression
3. Press "UPDATE CHART"
4. If your db connector usually displays problematic query in the message error, instead of an actual error Unexpected error Bad request will be shown.

Expected result
Unexpected error and an actual error message returned by api in response like below

Unexpected error
Error: HTTPDriver for [your clickhouse host] received ClickHouse error code 62
 Code: 62. DB::Exception: Syntax error: failed at position 37 ('<') (line 1, col 37): <a> AS `My column_b77020` 
FROM (select number from numbers(10)
) AS `virtual_table`
 LIMIT 1000
 FORMAT Native. Expected one of: expression with optional alias, element of expression with optional alias, lambda expression, CAST operator, NOT, INTERVAL, CASE, DATE, TIMESTAMP, tuple, collection of literals, array, number, literal, NULL, NULL, Bool, TRUE, FALSE, string literal, asterisk, qualified asterisk, compound identifier, identifier, COLUMNS matcher, COLUMNS, qualified COLUMNS matcher, function name, substitution, MySQL-style global variable, end of query. (SYNTAX_ERROR) (version [your clickhouse version] (official build))

Screenshots/recordings

Superset version

master / latest-dev

Python version

3.10

Node version

18 or greater

Browser

Chrome

Additional context

No response

Checklist

• I have searched Superset docs and Slack and didn't find a solution to my problem.
• I have searched the GitHub issue tracker and didn't find a similar bug report.
• I have checked Superset's logs for errors and if I found a relevant Python stacktrace, I included it here as text in the "additional context" section.

[dosubot]

Hello @timfursov! I'm Dosu, your friendly bot here to help you tackle bugs, answer questions, and explore contributions while you wait for a human maintainer. Let’s get this sorted out! 🎉

To address the issue where an error message containing HTML tags results in "Unexpected error Bad request" instead of displaying the actual error message in Apache Superset, you can follow these steps:

1. Use the ErrorBoundary Component: Ensure your chart component is wrapped with the ErrorBoundary component. This component is designed to catch errors and handle them gracefully.

2. Set the showMessage Prop: Configure the ErrorBoundary component with the showMessage prop set to true. This ensures that error messages are displayed.

3. Custom Error Handling: Implement a custom onError function within the ErrorBoundary to log errors or perform additional handling as needed.

4. Parse Error Messages Correctly: Verify that the error parsing logic in getClientErrorObject correctly handles HTML content. The function parseErrorJson checks for HTML in error messages and retrieves the appropriate message using retrieveErrorMessage. Ensure this logic is correctly implemented and tested.

5. Test Error Handling: Make sure your error handling logic is thoroughly tested, as demonstrated in the ErrorBoundary.test.tsx file. This includes verifying that the error message is displayed when showMessage is set to true ^[1][2][3][4].

By following these steps, you can ensure that error messages, including those with HTML tags, are displayed correctly and informatively, rather than defaulting to a generic "Unexpected error Bad request".

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}