mirror of
https://github.com/vector-im/element-web.git
synced 2024-11-16 05:04:57 +08:00
Expose and pre-populate thread ID in devtools dialog (#10953)
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Travis Ralston
GitHub
parent
cfd48b36aa
commit
8a97e5f351
@ -113,7 +113,13 @@ export const CommandCategories = {
|
||||
|
||||
export type RunResult = XOR<{ error: Error }, { promise: Promise<IContent | undefined> }>;
|
||||
|
||||
type RunFn = (this: Command, matrixClient: MatrixClient, roomId: string, args?: string) => RunResult;
|
||||
type RunFn = (
|
||||
this: Command,
|
||||
matrixClient: MatrixClient,
|
||||
roomId: string,
|
||||
threadId: string | null,
|
||||
args?: string,
|
||||
) => RunResult;
|
||||
|
||||
interface ICommandOpts {
|
||||
command: string;
|
||||
@ -184,7 +190,7 @@ export class Command {
|
||||
});
|
||||
}
|
||||
|
||||
return this.runFn(matrixClient, roomId, args);
|
||||
return this.runFn(matrixClient, roomId, threadId, args);
|
||||
}
|
||||
|
||||
public getUsage(): string {
|
||||
@ -232,7 +238,7 @@ export const Commands = [
|
||||
command: "spoiler",
|
||||
args: "<message>",
|
||||
description: _td("Sends the given message as a spoiler"),
|
||||
runFn: function (cli, roomId, message = "") {
|
||||
runFn: function (cli, roomId, threadId, message = "") {
|
||||
return successSync(ContentHelpers.makeHtmlMessage(message, `<span data-mx-spoiler>${message}</span>`));
|
||||
},
|
||||
category: CommandCategories.messages,
|
||||
@ -241,7 +247,7 @@ export const Commands = [
|
||||
command: "shrug",
|
||||
args: "<message>",
|
||||
description: _td("Prepends ¯\\_(ツ)_/¯ to a plain-text message"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let message = "¯\\_(ツ)_/¯";
|
||||
if (args) {
|
||||
message = message + " " + args;
|
||||
@ -254,7 +260,7 @@ export const Commands = [
|
||||
command: "tableflip",
|
||||
args: "<message>",
|
||||
description: _td("Prepends (╯°□°）╯︵ ┻━┻ to a plain-text message"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let message = "(╯°□°）╯︵ ┻━┻";
|
||||
if (args) {
|
||||
message = message + " " + args;
|
||||
@ -267,7 +273,7 @@ export const Commands = [
|
||||
command: "unflip",
|
||||
args: "<message>",
|
||||
description: _td("Prepends ┬──┬ ノ( ゜-゜ノ) to a plain-text message"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let message = "┬──┬ ノ( ゜-゜ノ)";
|
||||
if (args) {
|
||||
message = message + " " + args;
|
||||
@ -280,7 +286,7 @@ export const Commands = [
|
||||
command: "lenny",
|
||||
args: "<message>",
|
||||
description: _td("Prepends ( ͡° ͜ʖ ͡°) to a plain-text message"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let message = "( ͡° ͜ʖ ͡°)";
|
||||
if (args) {
|
||||
message = message + " " + args;
|
||||
@ -293,7 +299,7 @@ export const Commands = [
|
||||
command: "plain",
|
||||
args: "<message>",
|
||||
description: _td("Sends a message as plain text, without interpreting it as markdown"),
|
||||
runFn: function (cli, roomId, messages = "") {
|
||||
runFn: function (cli, roomId, threadId, messages = "") {
|
||||
return successSync(ContentHelpers.makeTextMessage(messages));
|
||||
},
|
||||
category: CommandCategories.messages,
|
||||
@ -302,7 +308,7 @@ export const Commands = [
|
||||
command: "html",
|
||||
args: "<message>",
|
||||
description: _td("Sends a message as html, without interpreting it as markdown"),
|
||||
runFn: function (cli, roomId, messages = "") {
|
||||
runFn: function (cli, roomId, threadId, messages = "") {
|
||||
return successSync(ContentHelpers.makeHtmlMessage(messages, messages));
|
||||
},
|
||||
category: CommandCategories.messages,
|
||||
@ -312,7 +318,7 @@ export const Commands = [
|
||||
args: "<new_version>",
|
||||
description: _td("Upgrades a room to a new version"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const room = cli.getRoom(roomId);
|
||||
if (!room?.currentState.mayClientSendStateEvent("m.room.tombstone", cli)) {
|
||||
@ -346,7 +352,7 @@ export const Commands = [
|
||||
args: "<YYYY-MM-DD>",
|
||||
description: _td("Jump to the given date in the timeline"),
|
||||
isEnabled: () => SettingsStore.getValue("feature_jump_to_date"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
return success(
|
||||
(async (): Promise<void> => {
|
||||
@ -387,7 +393,7 @@ export const Commands = [
|
||||
command: "nick",
|
||||
args: "<display_name>",
|
||||
description: _td("Changes your display nickname"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
return success(cli.setDisplayName(args));
|
||||
}
|
||||
@ -402,7 +408,7 @@ export const Commands = [
|
||||
args: "<display_name>",
|
||||
description: _td("Changes your display nickname in the current room only"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const ev = cli.getRoom(roomId)?.currentState.getStateEvents("m.room.member", cli.getSafeUserId());
|
||||
const content = {
|
||||
@ -421,7 +427,7 @@ export const Commands = [
|
||||
args: "[<mxc_url>]",
|
||||
description: _td("Changes the avatar of the current room"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let promise = Promise.resolve(args ?? null);
|
||||
if (!args) {
|
||||
promise = singleMxcUpload(cli);
|
||||
@ -442,7 +448,7 @@ export const Commands = [
|
||||
args: "[<mxc_url>]",
|
||||
description: _td("Changes your profile picture in this current room only"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
const room = cli.getRoom(roomId);
|
||||
const userId = cli.getSafeUserId();
|
||||
|
||||
@ -470,7 +476,7 @@ export const Commands = [
|
||||
command: "myavatar",
|
||||
args: "[<mxc_url>]",
|
||||
description: _td("Changes your profile picture in all rooms"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let promise = Promise.resolve(args ?? null);
|
||||
if (!args) {
|
||||
promise = singleMxcUpload(cli);
|
||||
@ -491,7 +497,7 @@ export const Commands = [
|
||||
args: "[<topic>]",
|
||||
description: _td("Gets or sets the room topic"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const html = htmlSerializeFromMdIfNeeded(args, { forceHTML: false });
|
||||
return success(cli.setRoomTopic(roomId, args, html));
|
||||
@ -529,7 +535,7 @@ export const Commands = [
|
||||
args: "<name>",
|
||||
description: _td("Sets the room name"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
return success(cli.setRoomName(roomId, args));
|
||||
}
|
||||
@ -544,7 +550,7 @@ export const Commands = [
|
||||
description: _td("Invites user with given id to current room"),
|
||||
analyticsName: "Invite",
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli) && shouldShowComponent(UIComponent.InviteUsers),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const [address, reason] = args.split(/\s+(.+)/);
|
||||
if (address) {
|
||||
@ -621,7 +627,7 @@ export const Commands = [
|
||||
aliases: ["j", "goto"],
|
||||
args: "<room-address>",
|
||||
description: _td("Joins room with given address"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
// Note: we support 2 versions of this command. The first is
|
||||
// the public-facing one for most users and the other is a
|
||||
@ -734,7 +740,7 @@ export const Commands = [
|
||||
description: _td("Leave room"),
|
||||
analyticsName: "Part",
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let targetRoomId: string | undefined;
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+)$/);
|
||||
@ -774,7 +780,7 @@ export const Commands = [
|
||||
args: "<user-id> [reason]",
|
||||
description: _td("Removes user with given id from this room"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+?)( +(.*))?$/);
|
||||
if (matches) {
|
||||
@ -791,7 +797,7 @@ export const Commands = [
|
||||
args: "<user-id> [reason]",
|
||||
description: _td("Bans user with given id"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+?)( +(.*))?$/);
|
||||
if (matches) {
|
||||
@ -808,7 +814,7 @@ export const Commands = [
|
||||
args: "<user-id>",
|
||||
description: _td("Unbans user with given ID"),
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+)$/);
|
||||
if (matches) {
|
||||
@ -825,7 +831,7 @@ export const Commands = [
|
||||
command: "ignore",
|
||||
args: "<user-id>",
|
||||
description: _td("Ignores a user, hiding their messages from you"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(@[^:]+:\S+)$/);
|
||||
if (matches) {
|
||||
@ -854,7 +860,7 @@ export const Commands = [
|
||||
command: "unignore",
|
||||
args: "<user-id>",
|
||||
description: _td("Stops ignoring a user, showing their messages going forward"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/(^@[^:]+:\S+$)/);
|
||||
if (matches) {
|
||||
@ -885,7 +891,7 @@ export const Commands = [
|
||||
args: "<user-id> [<power-level>]",
|
||||
description: _td("Define the power level of a user"),
|
||||
isEnabled: canAffectPowerlevels,
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+?)( +(-?\d+))?$/);
|
||||
let powerLevel = 50; // default power level for op
|
||||
@ -926,7 +932,7 @@ export const Commands = [
|
||||
args: "<user-id>",
|
||||
description: _td("Deops user with given id"),
|
||||
isEnabled: canAffectPowerlevels,
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+)$/);
|
||||
if (matches) {
|
||||
@ -955,8 +961,8 @@ export const Commands = [
|
||||
new Command({
|
||||
command: "devtools",
|
||||
description: _td("Opens the Developer Tools dialog"),
|
||||
runFn: function (cli, roomId) {
|
||||
Modal.createDialog(DevtoolsDialog, { roomId }, "mx_DevtoolsDialog_wrapper");
|
||||
runFn: function (cli, roomId, threadRootId) {
|
||||
Modal.createDialog(DevtoolsDialog, { roomId, threadRootId }, "mx_DevtoolsDialog_wrapper");
|
||||
return success();
|
||||
},
|
||||
category: CommandCategories.advanced,
|
||||
@ -969,7 +975,7 @@ export const Commands = [
|
||||
SettingsStore.getValue(UIFeature.Widgets) &&
|
||||
shouldShowComponent(UIComponent.AddIntegrations) &&
|
||||
!isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, widgetUrl) {
|
||||
runFn: function (cli, roomId, threadId, widgetUrl) {
|
||||
if (!widgetUrl) {
|
||||
return reject(new UserFriendlyError("Please supply a widget URL or embed code"));
|
||||
}
|
||||
@ -1022,7 +1028,7 @@ export const Commands = [
|
||||
command: "verify",
|
||||
args: "<user-id> <device-id> <device-signing-key>",
|
||||
description: _td("Verifies a user, session, and pubkey tuple"),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
const matches = args.match(/^(\S+) +(\S+) +(\S+)$/);
|
||||
if (matches) {
|
||||
@ -1144,7 +1150,7 @@ export const Commands = [
|
||||
command: "rainbow",
|
||||
description: _td("Sends the given message coloured as a rainbow"),
|
||||
args: "<message>",
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (!args) return reject(this.getUsage());
|
||||
return successSync(ContentHelpers.makeHtmlMessage(args, textToHtmlRainbow(args)));
|
||||
},
|
||||
@ -1154,7 +1160,7 @@ export const Commands = [
|
||||
command: "rainbowme",
|
||||
description: _td("Sends the given emote coloured as a rainbow"),
|
||||
args: "<message>",
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (!args) return reject(this.getUsage());
|
||||
return successSync(ContentHelpers.makeHtmlEmote(args, textToHtmlRainbow(args)));
|
||||
},
|
||||
@ -1174,7 +1180,7 @@ export const Commands = [
|
||||
description: _td("Displays information about a user"),
|
||||
args: "<user-id>",
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, userId) {
|
||||
runFn: function (cli, roomId, threadId, userId) {
|
||||
if (!userId || !userId.startsWith("@") || !userId.includes(":")) {
|
||||
return reject(this.getUsage());
|
||||
}
|
||||
@ -1195,7 +1201,7 @@ export const Commands = [
|
||||
description: _td("Send a bug report with logs"),
|
||||
isEnabled: () => !!SdkConfig.get().bug_report_endpoint_url,
|
||||
args: "<description>",
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
return success(
|
||||
Modal.createDialog(BugReportDialog, {
|
||||
initialText: args,
|
||||
@ -1230,7 +1236,7 @@ export const Commands = [
|
||||
command: "query",
|
||||
description: _td("Opens chat with the given user"),
|
||||
args: "<user-id>",
|
||||
runFn: function (cli, roomId, userId) {
|
||||
runFn: function (cli, roomId, threadId, userId) {
|
||||
// easter-egg for now: look up phone numbers through the thirdparty API
|
||||
// (very dumb phone number detection...)
|
||||
const isPhoneNumber = userId && /^\+?[0123456789]+$/.test(userId);
|
||||
@ -1266,7 +1272,7 @@ export const Commands = [
|
||||
command: "msg",
|
||||
description: _td("Sends a message to the given user"),
|
||||
args: "<user-id> [<message>]",
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
if (args) {
|
||||
// matches the first whitespace delimited group and then the rest of the string
|
||||
const matches = args.match(/^(\S+?)(?: +(.*))?$/s);
|
||||
@ -1302,7 +1308,7 @@ export const Commands = [
|
||||
description: _td("Places the call in the current room on hold"),
|
||||
category: CommandCategories.other,
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
const call = LegacyCallHandler.instance.getCallForRoom(roomId);
|
||||
if (!call) {
|
||||
return reject(new UserFriendlyError("No active call in this room"));
|
||||
@ -1317,7 +1323,7 @@ export const Commands = [
|
||||
description: _td("Takes the call in the current room off hold"),
|
||||
category: CommandCategories.other,
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
const call = LegacyCallHandler.instance.getCallForRoom(roomId);
|
||||
if (!call) {
|
||||
return reject(new UserFriendlyError("No active call in this room"));
|
||||
@ -1332,7 +1338,7 @@ export const Commands = [
|
||||
description: _td("Converts the room to a DM"),
|
||||
category: CommandCategories.other,
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
const room = cli.getRoom(roomId);
|
||||
if (!room) return reject(new UserFriendlyError("Could not find room"));
|
||||
return success(guessAndSetDMRoom(room, true));
|
||||
@ -1344,7 +1350,7 @@ export const Commands = [
|
||||
description: _td("Converts the DM to a room"),
|
||||
category: CommandCategories.other,
|
||||
isEnabled: (cli) => !isCurrentLocalRoom(cli),
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
const room = cli.getRoom(roomId);
|
||||
if (!room) return reject(new UserFriendlyError("Could not find room"));
|
||||
return success(guessAndSetDMRoom(room, false));
|
||||
@ -1367,7 +1373,7 @@ export const Commands = [
|
||||
command: effect.command,
|
||||
description: effect.description(),
|
||||
args: "<message>",
|
||||
runFn: function (cli, roomId, args) {
|
||||
runFn: function (cli, roomId, threadId, args) {
|
||||
let content: IContent;
|
||||
if (!args) {
|
||||
content = ContentHelpers.makeEmoteMessage(effect.fallbackMessage());
|
||||
|
||||
@ -65,12 +65,13 @@ const Tools: Record<Category, [label: string, tool: Tool][]> = {
|
||||
|
||||
interface IProps {
|
||||
roomId: string;
|
||||
threadRootId?: string | null;
|
||||
onFinished(finished?: boolean): void;
|
||||
}
|
||||
|
||||
type ToolInfo = [label: string, tool: Tool];
|
||||
|
||||
const DevtoolsDialog: React.FC<IProps> = ({ roomId, onFinished }) => {
|
||||
const DevtoolsDialog: React.FC<IProps> = ({ roomId, threadRootId, onFinished }) => {
|
||||
const [tool, setTool] = useState<ToolInfo | null>(null);
|
||||
|
||||
let body: JSX.Element;
|
||||
@ -125,9 +126,18 @@ const DevtoolsDialog: React.FC<IProps> = ({ roomId, onFinished }) => {
|
||||
<CopyableText className="mx_DevTools_label_right" getTextToCopy={() => roomId} border={false}>
|
||||
{_t("Room ID: %(roomId)s", { roomId })}
|
||||
</CopyableText>
|
||||
{!threadRootId ? null : (
|
||||
<CopyableText
|
||||
className="mx_DevTools_label_right"
|
||||
getTextToCopy={() => threadRootId}
|
||||
border={false}
|
||||
>
|
||||
{_t("Thread Root ID: %(threadRootId)s", { threadRootId })}
|
||||
</CopyableText>
|
||||
)}
|
||||
<div className="mx_DevTools_label_bottom" />
|
||||
{cli.getRoom(roomId) && (
|
||||
<DevtoolsContext.Provider value={{ room: cli.getRoom(roomId)! }}>
|
||||
<DevtoolsContext.Provider value={{ room: cli.getRoom(roomId)!, threadRootId }}>
|
||||
{body}
|
||||
</DevtoolsContext.Provider>
|
||||
)}
|
||||
|
||||
@ -88,6 +88,7 @@ export default BaseTool;
|
||||
|
||||
interface IContext {
|
||||
room: Room;
|
||||
threadRootId?: string | null;
|
||||
}
|
||||
|
||||
export const DevtoolsContext = createContext<IContext>({} as IContext);
|
||||
|
||||
@ -204,6 +204,13 @@ export const TimelineEventEditor: React.FC<IEditorProps> = ({ mxEvent, onBack })
|
||||
};
|
||||
|
||||
defaultContent = stringify(newContent);
|
||||
} else if (context.threadRootId) {
|
||||
defaultContent = stringify({
|
||||
"m.relates_to": {
|
||||
rel_type: "m.thread",
|
||||
event_id: context.threadRootId,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
return <EventEditor fieldDefs={fields} defaultContent={defaultContent} onSend={onSend} onBack={onBack} />;
|
||||
|
||||
@ -2841,6 +2841,7 @@
|
||||
"Toolbox": "Toolbox",
|
||||
"Developer Tools": "Developer Tools",
|
||||
"Room ID: %(roomId)s": "Room ID: %(roomId)s",
|
||||
"Thread Root ID: %(threadRootId)s": "Thread Root ID: %(threadRootId)s",
|
||||
"The poll has ended. No votes were cast.": "The poll has ended. No votes were cast.",
|
||||
"The poll has ended. Top answer: %(topAnswer)s": "The poll has ended. Top answer: %(topAnswer)s",
|
||||
"Failed to end poll": "Failed to end poll",
|
||||
|
||||
@ -15,7 +15,7 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
import React from "react";
|
||||
import { getByLabelText, render } from "@testing-library/react";
|
||||
import { getByLabelText, getAllByLabelText, render } from "@testing-library/react";
|
||||
import { Room } from "matrix-js-sdk/src/models/room";
|
||||
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
@ -29,10 +29,10 @@ describe("DevtoolsDialog", () => {
|
||||
let cli: MatrixClient;
|
||||
let room: Room;
|
||||
|
||||
function getComponent(roomId: string, onFinished = () => true) {
|
||||
function getComponent(roomId: string, threadRootId: string | null = null, onFinished = () => true) {
|
||||
return render(
|
||||
<MatrixClientContext.Provider value={cli}>
|
||||
<DevtoolsDialog roomId={roomId} onFinished={onFinished} />
|
||||
<DevtoolsDialog roomId={roomId} threadRootId={threadRootId} onFinished={onFinished} />
|
||||
</MatrixClientContext.Provider>,
|
||||
);
|
||||
}
|
||||
@ -68,4 +68,20 @@ describe("DevtoolsDialog", () => {
|
||||
expect(navigator.clipboard.writeText).toHaveBeenCalled();
|
||||
expect(navigator.clipboard.readText()).resolves.toBe(room.roomId);
|
||||
});
|
||||
|
||||
it("copies the thread root id when provided", async () => {
|
||||
const user = userEvent.setup();
|
||||
jest.spyOn(navigator.clipboard, "writeText");
|
||||
|
||||
const threadRootId = "$test_event_id_goes_here";
|
||||
const { container } = getComponent(room.roomId, threadRootId);
|
||||
|
||||
const copyBtn = getAllByLabelText(container, "Copy")[1];
|
||||
await user.click(copyBtn);
|
||||
const copiedBtn = getByLabelText(container, "Copied!");
|
||||
|
||||
expect(copiedBtn).toBeInTheDocument();
|
||||
expect(navigator.clipboard.writeText).toHaveBeenCalled();
|
||||
expect(navigator.clipboard.readText()).resolves.toBe(threadRootId);
|
||||
});
|
||||
});
|
||||
|
||||
71
test/components/views/dialogs/devtools/Event-test.tsx
Normal file
71
test/components/views/dialogs/devtools/Event-test.tsx
Normal file
@ -0,0 +1,71 @@
|
||||
/*
|
||||
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 React from "react";
|
||||
import { render } from "@testing-library/react";
|
||||
import { Room } from "matrix-js-sdk/src/models/room";
|
||||
import { PendingEventOrdering } from "matrix-js-sdk/src/client";
|
||||
|
||||
import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
|
||||
import { MatrixClientPeg } from "../../../../../src/MatrixClientPeg";
|
||||
import { stubClient } from "../../../../test-utils";
|
||||
import { DevtoolsContext } from "../../../../../src/components/views/dialogs/devtools/BaseTool";
|
||||
import { TimelineEventEditor } from "../../../../../src/components/views/dialogs/devtools/Event";
|
||||
|
||||
describe("<EventEditor />", () => {
|
||||
beforeEach(() => {
|
||||
stubClient();
|
||||
});
|
||||
|
||||
it("should render", () => {
|
||||
const cli = MatrixClientPeg.safeGet();
|
||||
const { asFragment } = render(
|
||||
<MatrixClientContext.Provider value={cli}>
|
||||
<DevtoolsContext.Provider
|
||||
value={{
|
||||
room: new Room("!roomId", cli, "@alice:example.com", {
|
||||
pendingEventOrdering: PendingEventOrdering.Detached,
|
||||
}),
|
||||
}}
|
||||
>
|
||||
<TimelineEventEditor onBack={() => {}} />
|
||||
</DevtoolsContext.Provider>
|
||||
</MatrixClientContext.Provider>,
|
||||
);
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
describe("thread context", () => {
|
||||
it("should pre-populate a thread relationship", () => {
|
||||
const cli = MatrixClientPeg.safeGet();
|
||||
const { asFragment } = render(
|
||||
<MatrixClientContext.Provider value={cli}>
|
||||
<DevtoolsContext.Provider
|
||||
value={{
|
||||
room: new Room("!roomId", cli, "@alice:example.com", {
|
||||
pendingEventOrdering: PendingEventOrdering.Detached,
|
||||
}),
|
||||
threadRootId: "$this_is_a_thread_id",
|
||||
}}
|
||||
>
|
||||
<TimelineEventEditor onBack={() => {}} />
|
||||
</DevtoolsContext.Provider>
|
||||
</MatrixClientContext.Provider>,
|
||||
);
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,126 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`<EventEditor /> should render 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
class="mx_DevTools_content"
|
||||
>
|
||||
<div
|
||||
class="mx_DevTools_eventTypeStateKeyGroup"
|
||||
>
|
||||
<div
|
||||
class="mx_Field mx_Field_input"
|
||||
>
|
||||
<input
|
||||
autocomplete="on"
|
||||
id="eventType"
|
||||
label="Event Type"
|
||||
placeholder="Event Type"
|
||||
size="42"
|
||||
type="text"
|
||||
value=""
|
||||
/>
|
||||
<label
|
||||
for="eventType"
|
||||
>
|
||||
Event Type
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_Field mx_Field_textarea mx_DevTools_textarea"
|
||||
>
|
||||
<textarea
|
||||
autocomplete="off"
|
||||
id="evContent"
|
||||
label="Event Content"
|
||||
placeholder="Event Content"
|
||||
type="text"
|
||||
>
|
||||
{
|
||||
|
||||
}
|
||||
</textarea>
|
||||
<label
|
||||
for="evContent"
|
||||
>
|
||||
Event Content
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button>
|
||||
Back
|
||||
</button>
|
||||
<button>
|
||||
Send
|
||||
</button>
|
||||
</div>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`<EventEditor /> thread context should pre-populate a thread relationship 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
class="mx_DevTools_content"
|
||||
>
|
||||
<div
|
||||
class="mx_DevTools_eventTypeStateKeyGroup"
|
||||
>
|
||||
<div
|
||||
class="mx_Field mx_Field_input"
|
||||
>
|
||||
<input
|
||||
autocomplete="on"
|
||||
id="eventType"
|
||||
label="Event Type"
|
||||
placeholder="Event Type"
|
||||
size="42"
|
||||
type="text"
|
||||
value=""
|
||||
/>
|
||||
<label
|
||||
for="eventType"
|
||||
>
|
||||
Event Type
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_Field mx_Field_textarea mx_DevTools_textarea"
|
||||
>
|
||||
<textarea
|
||||
autocomplete="off"
|
||||
id="evContent"
|
||||
label="Event Content"
|
||||
placeholder="Event Content"
|
||||
type="text"
|
||||
>
|
||||
{
|
||||
"m.relates_to": {
|
||||
"rel_type": "m.thread",
|
||||
"event_id": "$this_is_a_thread_id"
|
||||
}
|
||||
}
|
||||
</textarea>
|
||||
<label
|
||||
for="evContent"
|
||||
>
|
||||
Event Content
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx_Dialog_buttons"
|
||||
>
|
||||
<button>
|
||||
Back
|
||||
</button>
|
||||
<button>
|
||||
Send
|
||||
</button>
|
||||
</div>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
Loading…
Reference in New Issue
Block a user