element-web-Github/test/components/views/elements/SyntaxHighlight-test.tsx
Clark Fischer 2417482667
Fix error when viewing source of redacted events (#9914)
* Fix viewing source of redacted events

Clicking 'View Source' in the context menu of a redacted event causes an error,
and the user gets no visible result.

This fixes <ViewSource /> to indicate that the source is unavailable when a
message has been redacted. The original source remains available.

<SyntaxHighlight /> requires a non-null string for its `content` prop, and, in
the case of redacted events, <ViewSource /> was passing `undefined`. This is
ultimately because redacting an event causes `MatrixEvent.clearEvent` to be
`undefined`, which <ViewSource /> wasn't checking.

Fixes https://github.com/vector-im/element-web/issues/24165

Signed-off-by: Clark Fischer <clark.fischer@gmail.com>

* Use correct highlight.js call

Previous call signature was deprecated.

See https://github.com/highlightjs/highlight.js/issues/2277

Signed-off-by: Clark Fischer <clark.fischer@gmail.com>

Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
2023-01-15 16:22:59 +00:00

39 lines
1.4 KiB
TypeScript

/* eslint @typescript-eslint/no-unused-vars: ["error", { "varsIgnorePattern": "^_" }] */
/*
Copyright 2023 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { render } from "@testing-library/react";
import hljs, { type HighlightOptions } from "highlight.js";
import React from "react";
import SyntaxHighlight from "../../../../src/components/views/elements/SyntaxHighlight";
describe("<SyntaxHighlight />", () => {
it("renders", () => {
const { container } = render(<SyntaxHighlight>console.log("Hello, World!");</SyntaxHighlight>);
expect(container).toMatchSnapshot();
});
it.each(["json", "javascript", "css"])("uses the provided language", (lang) => {
const mock = jest.spyOn(hljs, "highlight");
render(<SyntaxHighlight language={lang}>// Hello, World</SyntaxHighlight>);
const [_lang, opts] = mock.mock.lastCall!;
expect((opts as HighlightOptions)["language"]).toBe(lang);
});
});