Skip to content

Handle syntax errors in RedBox #4666

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
30 commits merged into from
Apr 22, 2020
Merged

Handle syntax errors in RedBox #4666

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
fdd1867
Publish fix
acoates-ms Apr 9, 2020
a53564d
Creating new Microsoft.ReactNative.sln (#4535)
jonthysell Apr 9, 2020
8bc5d3a
applying package updates ***NO_CI***
rnbot Apr 9, 2020
ddbfb04
Move playground app to use Microsoft.ReactNative (#4534)
acoates-ms Apr 9, 2020
59094fd
Bump beachball from 1.28.0 to 1.28.1 (#4539)
dependabot-preview[bot] Apr 9, 2020
f5db344
applying package updates ***NO_CI***
rnbot Apr 9, 2020
3ef811b
applying package updates ***NO_CI***
rnbot Apr 9, 2020
5201232
Enabling managed unit tests in CI loop (#4532)
jonthysell Apr 9, 2020
4aa64fa
applying package updates ***NO_CI***
rnbot Apr 9, 2020
ae4e4c9
Remove 'Delete Android SDK' from E2ETest (#4554)
jonthysell Apr 9, 2020
2f4fffa
Enable WebSocketModule unit tests (#4538)
JunielKatarn Apr 10, 2020
aa853d9
applying package updates ***NO_CI***
rnbot Apr 10, 2020
e10d541
Improve inner loop and error reporting (local CLI) (#4536)
asklar Apr 10, 2020
5bd5efb
applying package updates ***NO_CI***
rnbot Apr 10, 2020
f2a0d00
Don't set readyState on connection error (#4562)
JunielKatarn Apr 10, 2020
da695df
applying package updates ***NO_CI***
rnbot Apr 10, 2020
8fdada9
Bump @babel/core from 7.8.4 to 7.9.0 (#4565)
dependabot-preview[bot] Apr 10, 2020
e3449a3
Simplified C++ macros and improved their comments (#4568)
vmoroz Apr 10, 2020
380c1ad
applying package updates ***NO_CI***
rnbot Apr 10, 2020
cbe66c4
Merge branch 'master' of https://github.com/asklar/react-native-windows
asklar Apr 11, 2020
315810a
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 14, 2020
901ffc9
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 17, 2020
895c986
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 17, 2020
7d894a7
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 19, 2020
8f0a2b1
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 21, 2020
7e4fe90
Merge branch 'master' of https://github.com/microsoft/react-native-wi…
asklar Apr 21, 2020
ddd5200
Handle syntax errors in RedBox
asklar Apr 21, 2020
970aea8
Change files
asklar Apr 21, 2020
667a9a0
format
asklar Apr 21, 2020
f406691
clean up
asklar Apr 22, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions change/react-native-windows-2020-04-21-15-00-44-redboxSyntaxError.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"type": "prerelease",
"comment": "Handle syntax errors in RedBox",
"packageName": "react-native-windows",
"email": "asklar@microsoft.com",
"dependentChangeType": "patch",
"date": "2020-04-21T22:00:44.285Z"
}
45 changes: 30 additions & 15 deletions vnext/Microsoft.ReactNative/RedBox.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,15 +158,13 @@ struct RedBox : public std::enable_shared_from_this<RedBox> {
#define MAKE_WIDE_STR(x) _MAKE_WIDE_STR(x)

void UpdateErrorMessageUI() noexcept {
const std::regex colorsRegex(
"\\x1b\\[[0-9;]*m"); // strip out console colors which is often added to JS error messages
const std::string plain = std::regex_replace(m_errorInfo.Message, colorsRegex, "");

try {
auto json = folly::parseJson(m_errorInfo.Message);
if (json.count("name") && json["name"] == "Error") {
auto message = json["message"].asString();
auto stack = json["stack"].asString().substr(ARRAYSIZE("Error: ") + message.length());
m_errorMessageText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(message));
m_errorStackText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(stack));
return;
} else if (json.count("type") && json["type"] == "InternalError") {
auto json = folly::parseJson(plain);
if (json.count("type") && json["type"] == "InternalError") {
auto message = json["message"].asString();
m_errorMessageText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(message));

Expand All @@ -187,14 +185,34 @@ struct RedBox : public std::enable_shared_from_this<RedBox> {
m_errorStackText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(json["type"].asString()));
}
return;
} else if (json.count("name") && boost::ends_with(json["name"].asString(), "Error")) {
auto message = std::regex_replace(json["message"].asString(), colorsRegex, "");
const auto originalStack = std::regex_replace(json["stack"].asString(), colorsRegex, "");

const auto errorName = json["name"].asString();
std::string stack;

const auto prefix = errorName + ": " + message;
if (boost::starts_with(originalStack, prefix)) {
stack = originalStack.substr(prefix.length());
} else {
constexpr char startOfStackTrace[] = "\n at ";
stack = originalStack.substr(originalStack.find(startOfStackTrace) + 1);
}

m_errorMessageText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(message));
// Some messages (like SyntaxError) rely on fixed-width font to be properly formatted and indented.
m_errorMessageText.FontFamily(xaml::Media::FontFamily(L"Consolas"));

m_errorStackText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(stack));
return;
}
} catch (...) {
std::string doctype = "<!DOCTYPE HTML>";
if (boost::istarts_with(m_errorInfo.Message, doctype)) {
if (boost::istarts_with(plain, doctype)) {
auto webView = xaml::Controls::WebView(xaml::Controls::WebViewExecutionMode::SameThread);

winrt::hstring content(
Microsoft::Common::Unicode::Utf8ToUtf16(m_errorInfo.Message.substr(doctype.length()).c_str()));
winrt::hstring content(Microsoft::Common::Unicode::Utf8ToUtf16(plain.substr(doctype.length()).c_str()));

webView.HorizontalAlignment(xaml::HorizontalAlignment::Stretch);
webView.VerticalAlignment(xaml::VerticalAlignment::Stretch);
Expand Down Expand Up @@ -245,10 +263,7 @@ struct RedBox : public std::enable_shared_from_this<RedBox> {
}
}
// fall back to displaying the raw message string
const std::regex colorsRegex(
"\\x1b\\[[0-9;]*m"); // strip out console colors which is often added to JS error messages
const std::string formated = std::regex_replace(m_errorInfo.Message, colorsRegex, "");
m_errorMessageText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(formated));
m_errorMessageText.Text(Microsoft::Common::Unicode::Utf8ToUtf16(plain));
m_errorStackText.Text(L"");
}

Expand Down