Skip to content
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

Improve fatal error message #186609

Merged
merged 5 commits into from
Jul 2, 2024
Merged

Improve fatal error message #186609

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
35bcea6
improve fatal error message
Dosant Jun 21, 2024
5f35188
Merge branch 'main' into d/2024-06-21-improve-error
kibanamachine Jun 24, 2024
df25b98
Merge branch 'main' of github.com:elastic/kibana into d/2024-06-21-im…
Dosant Jul 2, 2024
329c833
adjust message to include browser console rec
Dosant Jul 2, 2024
69ef861
Merge branch 'd/2024-06-21-improve-error' of github.com:Dosant/kibana…
Dosant Jul 2, 2024
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
41 changes: 32 additions & 9 deletions ...g/core-rendering-server-internal/src/bootstrap/__snapshots__/render_template.test.ts.snap
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

41 changes: 32 additions & 9 deletions packages/core/rendering/core-rendering-server-internal/src/bootstrap/render_template.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,15 +68,38 @@ if (window.__kbnStrictCsp__ && window.__kbnCspNotEnforced__) {
// make subsequent calls to failure() noop
failure = function () {};

var err = document.createElement('h1');
err.style['color'] = 'white';
err.style['font-family'] = 'monospace';
err.style['text-align'] = 'center';
err.style['background'] = '#F44336';
err.style['padding'] = '25px';
err.innerText = document.querySelector('[data-error-message]').dataset.errorMessage;

document.body.innerHTML = err.outerHTML;
var errorTitle = document.querySelector('[data-error-message-title]').dataset.errorMessageTitle;
var errorText = document.querySelector('[data-error-message-text]').dataset.errorMessageText;
var errorReload = document.querySelector('[data-error-message-reload]').dataset.errorMessageReload;

var err = document.createElement('div');
err.style.textAlign = 'center';
err.style.padding = '120px 20px';
err.style.fontFamily = 'Inter, BlinkMacSystemFont, Helvetica, Arial, sans-serif';

var errorTitleEl = document.createElement('h1');
errorTitleEl.innerText = errorTitle;
errorTitleEl.style.margin = '20px';

var errorTextEl = document.createElement('p');
errorTextEl.innerText = errorText;
errorTextEl.style.margin = '20px';

var errorReloadEl = document.createElement('button');
errorReloadEl.innerText = errorReload;
errorReloadEl.onclick = function () {
location.reload();
};
errorReloadEl.setAttribute('style',
'cursor: pointer; padding-inline: 12px; block-size: 40px; font-size: 1rem; line-height: 1.4286rem; border-radius: 6px; min-inline-size: 112px; color: rgb(255, 255, 255); background-color: rgb(0, 119, 204); outline-color: rgb(0, 0, 0); border:none'
);
Comment on lines +71 to +95
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We're in 2008. jQuery just got out of beta, and developers are still forced to have their "code" work on IE5.5 and IE6. (jocking, doc.querySelector wasn't a thing for IE6)


err.appendChild(errorTitleEl);
err.appendChild(errorTextEl);
err.appendChild(errorReloadEl);

document.body.innerHTML = '';
document.body.appendChild(err);
}

var stylesheetTarget = document.querySelector('head meta[name="add-styles-here"]')
Expand Down
10 changes: 8 additions & 2 deletions packages/core/rendering/core-rendering-server-internal/src/views/template.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,9 +80,15 @@ export const Template: FunctionComponent<Props> = ({
{logo}
<div
className="kbnWelcomeText"
data-error-message={i18n('core.ui.welcomeErrorMessage', {
data-error-message-title={i18n('core.ui.welcomeErrorMessageTitle', {
defaultMessage: 'Elastic did not load properly',
})}
data-error-message-text={i18n('core.ui.welcomeErrorMessageText', {
defaultMessage:
'Elastic did not load properly. Check the server output for more information.',
'Please reload this page. If the issue persists, check the server logs.',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: should we mention the browser's console as well?

AFAIK, more often than not, this error is likely an issue loading assets, and it will probably be more obvious to start with the browser's console logs.

Copy link
Contributor Author

@Dosant Dosant Jul 2, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Getting back to this, how about?

Please reload this page. If the issue persists, check the browser console and server logs.

Screenshot 2024-07-02 at 10 58 23

})}
data-error-message-reload={i18n('core.ui.welcomeErrorReloadButton', {
defaultMessage: 'Reload',
})}
>
{i18n('core.ui.welcomeMessage', {
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/fr-FR.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1069,7 +1069,6 @@
"core.ui.searchNavList.label": "Recherche",
"core.ui.securityNavList.label": "Sécurité",
"core.ui.skipToMainButton": "Passer au contenu principal",
"core.ui.welcomeErrorMessage": "Elastic ne s'est pas chargé correctement. Vérifiez la sortie du serveur pour plus d'informations.",
"core.ui.welcomeMessage": "Chargement d'Elastic",
"customIntegrations.components.replacementAccordion.recommendationDescription": "Les intégrations d'Elastic Agent sont recommandées, mais vous pouvez également utiliser Beats. Pour plus de détails, consultez notre {link}.",
"customIntegrations.languageClients.DotnetElasticsearch.readme.connectingText": "Vous pouvez vous connecter à Elastic Cloud à l'aide d'une {api_key} et d'un {cloud_id} :",
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/ja-JP.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1069,7 +1069,6 @@
"core.ui.searchNavList.label": "検索",
"core.ui.securityNavList.label": "セキュリティ",
"core.ui.skipToMainButton": "メインコンテンツに移動",
"core.ui.welcomeErrorMessage": "Elasticが正常に読み込まれませんでした。詳細はサーバーアウトプットを確認してください。",
"core.ui.welcomeMessage": "Elastic の読み込み中",
"customIntegrations.components.replacementAccordion.recommendationDescription": "Elasticエージェント統合が推奨されますが、Beatsも使用できます。詳細については、{link}。",
"customIntegrations.languageClients.DotnetElasticsearch.readme.connectingText": "{api_key}と{cloud_id}を使用して、Elastic Cloudに接続できます。",
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/translations/translations/zh-CN.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1071,7 +1071,6 @@
"core.ui.searchNavList.label": "搜索",
"core.ui.securityNavList.label": "安全",
"core.ui.skipToMainButton": "跳到主要内容",
"core.ui.welcomeErrorMessage": "Elastic 未正确加载。检查服务器输出以了解详情。",
"core.ui.welcomeMessage": "正在加载 Elastic",
"customIntegrations.components.replacementAccordion.recommendationDescription": "建议使用 Elastic 代理集成，但也可以使用 Beats。有关更多详情，请访问 {link}。",
"customIntegrations.languageClients.DotnetElasticsearch.readme.connectingText": "您可以使用 {api_key} 和 {cloud_id} 连接到 Elastic Cloud：",
Expand Down