fallback to event text in location body when map unavailable (#7982)

* center icon better

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove debug

Signed-off-by: Kerry Archibald <kerrya@element.io>

* retrigger all builds

Signed-off-by: Kerry Archibald <kerrya@element.io>

* set assetType on share event

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use pin marker on map for pin drop share

Signed-off-by: Kerry Archibald <kerrya@element.io>

* lint

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test events

Signed-off-by: Kerry Archibald <kerrya@element.io>

* pin drop helper text

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use generic location type

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add navigationcontrol when in pin mode

Signed-off-by: Kerry Archibald <kerrya@element.io>

* allow pin drop without location permissions

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove geolocate control when pin dropping without geo perms

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test locationpicker

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test marker type, tidy

Signed-off-by: Kerry Archibald <kerrya@element.io>

* move findMapStyleUrl

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fallback to event content when cant render map

Signed-off-by: Kerry Archibald <kerrya@element.io>

* update mocks in location picker, show same messages as timeline

Signed-off-by: Kerry Archibald <kerrya@element.io>

* style error message in location share menu

Signed-off-by: Kerry Archibald <kerrya@element.io>

* i18n

Signed-off-by: Kerry Archibald <kerrya@element.io>

* forgotten copyright

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add copyright

Signed-off-by: Kerry Archibald <kerrya@element.io>

* update style

Signed-off-by: Kerry Archibald <kerrya@element.io>

* icon bigger

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-03-11 09:52:57 +01:00 committed by GitHub
parent 9082e07ff4
commit d38a1fa201
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 485 additions and 68 deletions

View file

@ -14,6 +14,9 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import { mount } from "enzyme";
import { mocked } from 'jest-mock';
import { makeLocationContent } from "matrix-js-sdk/src/content-helpers";
import {
M_ASSET,
@ -24,14 +27,30 @@ import {
} from "matrix-js-sdk/src/@types/location";
import { TEXT_NODE_TYPE } from "matrix-js-sdk/src/@types/extensible_events";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import maplibregl from 'maplibre-gl';
import { logger } from 'matrix-js-sdk/src/logger';
import sdk from "../../../skinned-sdk";
import {
import MLocationBody, {
createMapSiteLink,
isSelfLocation,
parseGeoUri,
} from "../../../../src/components/views/messages/MLocationBody";
import MatrixClientContext from "../../../../src/contexts/MatrixClientContext";
import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks";
import { MediaEventHelper } from "../../../../src/utils/MediaEventHelper";
import { getTileServerWellKnown } from "../../../../src/utils/WellKnownUtils";
import SdkConfig from "../../../../src/SdkConfig";
jest.mock("../../../../src/utils/WellKnownUtils", () => ({
getTileServerWellKnown: jest.fn(),
}));
let EVENT_ID = 0;
function nextId(): string {
EVENT_ID++;
return EVENT_ID.toString();
}
sdk.getComponent("views.messages.MLocationBody");
describe("MLocationBody", () => {
@ -245,6 +264,59 @@ describe("MLocationBody", () => {
expect(isSelfLocation(content)).toBe(false);
});
});
describe('<MLocationBody>', () => {
describe('with error', () => {
const mockClient = {
on: jest.fn(),
off: jest.fn(),
};
const defaultEvent = modernLocationEvent("geo:51.5076,-0.1276", LocationAssetType.Pin);
const defaultProps = {
mxEvent: defaultEvent,
highlights: [],
highlightLink: '',
onHeightChanged: jest.fn(),
onMessageAllowed: jest.fn(),
permalinkCreator: {} as RoomPermalinkCreator,
mediaEventHelper: {} as MediaEventHelper,
};
const getComponent = (props = {}) => mount(<MLocationBody {...defaultProps} {...props} />, {
wrappingComponent: MatrixClientContext.Provider,
wrappingComponentProps: { value: mockClient },
});
let sdkConfigSpy;
beforeEach(() => {
// eat expected errors to keep console clean
jest.spyOn(logger, 'error').mockImplementation(() => { });
mocked(getTileServerWellKnown).mockReturnValue({});
sdkConfigSpy = jest.spyOn(SdkConfig, 'get').mockReturnValue({});
});
afterAll(() => {
sdkConfigSpy.mockRestore();
jest.spyOn(logger, 'error').mockRestore();
});
it('displays correct fallback content without error style when map_style_url is not configured', () => {
const component = getComponent();
expect(component.find(".mx_EventTile_body")).toMatchSnapshot();
});
it('displays correct fallback content when map_style_url is misconfigured', () => {
const mockMap = new maplibregl.Map();
mocked(getTileServerWellKnown).mockReturnValue({ map_style_url: 'bad-tile-server.com' });
const component = getComponent();
// simulate error initialising map in maplibregl
// @ts-ignore
mockMap.emit('error', { status: 404 });
component.setProps({});
expect(component.find(".mx_EventTile_body")).toMatchSnapshot();
});
});
});
});
function oldLocationEvent(geoUri: string): MatrixEvent {
@ -261,7 +333,7 @@ function oldLocationEvent(geoUri: string): MatrixEvent {
);
}
function modernLocationEvent(geoUri: string): MatrixEvent {
function modernLocationEvent(geoUri: string, assetType?: LocationAssetType): MatrixEvent {
return new MatrixEvent(
{
"event_id": nextId(),
@ -271,6 +343,7 @@ function modernLocationEvent(geoUri: string): MatrixEvent {
geoUri,
252523,
"Human-readable label",
assetType,
),
},
);
@ -290,9 +363,3 @@ function nonLocationEvent(): MatrixEvent {
},
);
}
let EVENT_ID = 0;
function nextId(): string {
EVENT_ID++;
return EVENT_ID.toString();
}

View file

@ -0,0 +1,29 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`MLocationBody <MLocationBody> with error displays correct fallback content when map_style_url is misconfigured 1`] = `
<div
className="mx_EventTile_body"
>
<span
className="mx_EventTile_tileError"
>
Unable to load map: This homeserver is not configured correctly to display maps, or the configured map server may be unreachable.
</span>
<br />
Shared a location: Found at geo:51.5076,-0.1276 at 2021-12-21T12:22+0000
</div>
`;
exports[`MLocationBody <MLocationBody> with error displays correct fallback content without error style when map_style_url is not configured 1`] = `
<div
className="mx_EventTile_body"
>
<span
className=""
>
Unable to load map: This homeserver is not configured to display maps.
</span>
<br />
Shared a location: Found at geo:51.5076,-0.1276 at 2021-12-21T12:22+0000
</div>
`;