(core) allow copying errors from regular cell editor

Summary:
There was already some support for copying errors from the detached/expanded formula editor. This adds support for copying errors in the regular cell editor.

Getting error details is now done only by clicking on the expand icon - previously you could click on the error text itself.

A few unrelated test changes are made for exact-pixel checks that were often out by approx 1 pixel on my machine.

Test Plan: Updated tests. Tested copying/pasting manually.

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D4002
This commit is contained in:
Paul Fitzpatrick 2023-08-14 18:06:01 -04:00
parent fad421b7c0
commit fe846d3068
2 changed files with 8 additions and 20 deletions

View File

@ -183,14 +183,13 @@ export class FormulaEditor extends NewBaseEditor {
// By not doing anything special here we assume that the input element will take the focus. // By not doing anything special here we assume that the input element will take the focus.
return; return;
} }
}
// Allow clicking the error message. // Allow clicking the error message.
if (ev.target instanceof HTMLElement && ( if (ev.target instanceof HTMLElement && (
ev.target.classList.contains('error_msg') || ev.target.classList.contains('error_msg') ||
ev.target.classList.contains('error_details_inner') ev.target.classList.contains('error_details_inner')
)) { )) {
return; return;
}
} }
ev.preventDefault(); ev.preventDefault();
this.focus(); this.focus();
@ -232,19 +231,12 @@ export class FormulaEditor extends NewBaseEditor {
), ),
dom.maybe(options.formulaError, () => [ dom.maybe(options.formulaError, () => [
dom('div.error_msg', testId('formula-error-msg'), dom('div.error_msg', testId('formula-error-msg'),
dom.on('click', () => { dom.attr('tabindex', '-1'),
if (this.isDetached.get()) { return; }
if (errorDetails.get()){
hideErrDetails.set(!hideErrDetails.get());
this._aceEditor.resize();
}
}),
dom.maybe(errorDetails, () => dom.maybe(errorDetails, () =>
dom.domComputed(hideErrDetails, (hide) => cssCollapseIcon( dom.domComputed(hideErrDetails, (hide) => cssCollapseIcon(
hide ? 'Expand' : 'Collapse', hide ? 'Expand' : 'Collapse',
testId('formula-error-expand'), testId('formula-error-expand'),
dom.on('click', () => { dom.on('click', () => {
if (!this.isDetached.get()) { return; }
if (errorDetails.get()){ if (errorDetails.get()){
hideErrDetails.set(!hideErrDetails.get()); hideErrDetails.set(!hideErrDetails.get());
this._aceEditor.resize(); this._aceEditor.resize();
@ -256,6 +248,7 @@ export class FormulaEditor extends NewBaseEditor {
), ),
dom.maybe(use => Boolean(use(errorDetails) && !use(hideErrDetails)), () => dom.maybe(use => Boolean(use(errorDetails) && !use(hideErrDetails)), () =>
dom('div.error_details', dom('div.error_details',
dom.attr('tabindex', '-1'),
dom('div.error_details_inner', dom('div.error_details_inner',
dom.text(errorDetails), dom.text(errorDetails),
), ),
@ -750,10 +743,6 @@ const cssFormulaEditor = styled('div.default_editor.formula_editor_wrapper', `
flex-shrink: 0; flex-shrink: 0;
} }
&-detached .error_msg {
cursor: default;
}
&-detached .code_editor_container { &-detached .code_editor_container {
height: 100%; height: 100%;
width: 100%; width: 100%;

View File

@ -113,7 +113,6 @@
background-color: #ffb6c1; background-color: #ffb6c1;
padding: 4px; padding: 4px;
color: black; color: black;
cursor: pointer;
white-space: pre-wrap; white-space: pre-wrap;
flex: none; flex: none;
overflow: auto; overflow: auto;