mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
fix: show error message when measureText API breaks in brave (#6336)
* fix: show error message when measureText API breaks in brave * Add docs * Add assets * tweak message * fix * tweak message * add translations * lint * fix * fix * lint * lint * lint please work now * tweak doc * fix * split error component to new file * add specs * tweaks Co-authored-by: David Luzar <luzar.david@gmail.com> * wrap in div with a width of 30rem * fix spec * fix * Fix typo --------- Co-authored-by: David Luzar <luzar.david@gmail.com> Co-authored-by: Daniel J. Geiger <1852529+DanielJGeiger@users.noreply.github.com>
This commit is contained in:
parent
1eee488dab
commit
023313e92f
17 changed files with 244 additions and 23 deletions
|
@ -62,6 +62,7 @@ import {
|
|||
GRID_SIZE,
|
||||
IMAGE_RENDER_TIMEOUT,
|
||||
isAndroid,
|
||||
isBrave,
|
||||
LINE_CONFIRM_THRESHOLD,
|
||||
MAX_ALLOWED_FILE_BYTES,
|
||||
MIME_TYPES,
|
||||
|
@ -267,6 +268,7 @@ import {
|
|||
getContainerDims,
|
||||
getContainerElement,
|
||||
getTextBindableContainerAtPosition,
|
||||
isMeasureTextSupported,
|
||||
isValidTextContainer,
|
||||
} from "../element/textElement";
|
||||
import { isHittingElementNotConsideringBoundingBox } from "../element/collision";
|
||||
|
@ -285,6 +287,7 @@ import { actionToggleHandTool } from "../actions/actionCanvas";
|
|||
import { jotaiStore } from "../jotai";
|
||||
import { activeConfirmDialogAtom } from "./ActiveConfirmDialog";
|
||||
import { actionCreateContainerFromText } from "../actions/actionBoundText";
|
||||
import BraveMeasureTextError from "./BraveMeasureTextError";
|
||||
|
||||
const deviceContextInitialValue = {
|
||||
isSmScreen: false,
|
||||
|
@ -429,7 +432,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||
};
|
||||
|
||||
this.id = nanoid();
|
||||
|
||||
this.library = new Library(this);
|
||||
if (excalidrawRef) {
|
||||
const readyPromise =
|
||||
|
@ -711,6 +713,8 @@ class App extends React.Component<AppProps, AppState> {
|
|||
const theme =
|
||||
actionResult?.appState?.theme || this.props.theme || THEME.LIGHT;
|
||||
let name = actionResult?.appState?.name ?? this.state.name;
|
||||
const errorMessage =
|
||||
actionResult?.appState?.errorMessage ?? this.state.errorMessage;
|
||||
if (typeof this.props.viewModeEnabled !== "undefined") {
|
||||
viewModeEnabled = this.props.viewModeEnabled;
|
||||
}
|
||||
|
@ -726,7 +730,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||
if (typeof this.props.name !== "undefined") {
|
||||
name = this.props.name;
|
||||
}
|
||||
|
||||
this.setState(
|
||||
(state) => {
|
||||
// using Object.assign instead of spread to fool TS 4.2.2+ into
|
||||
|
@ -744,6 +747,7 @@ class App extends React.Component<AppProps, AppState> {
|
|||
gridSize,
|
||||
theme,
|
||||
name,
|
||||
errorMessage,
|
||||
});
|
||||
},
|
||||
() => {
|
||||
|
@ -872,7 +876,6 @@ class App extends React.Component<AppProps, AppState> {
|
|||
),
|
||||
};
|
||||
}
|
||||
|
||||
// FontFaceSet loadingdone event we listen on may not always fire
|
||||
// (looking at you Safari), so on init we manually load fonts for current
|
||||
// text elements on canvas, and rerender them once done. This also
|
||||
|
@ -1000,6 +1003,13 @@ class App extends React.Component<AppProps, AppState> {
|
|||
} else {
|
||||
this.updateDOMRect(this.initializeScene);
|
||||
}
|
||||
|
||||
// note that this check seems to always pass in localhost
|
||||
if (isBrave() && !isMeasureTextSupported()) {
|
||||
this.setState({
|
||||
errorMessage: <BraveMeasureTextError />,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
public componentWillUnmount() {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue