Improve switching between rich and plain editing modes (#9776)

* allows switching between modes that retains formatting
* updates rich text composer dependency to 0.13.0 (@matrix-org/matrix-wysiwyg)
* improves handling of enter keypresses when ctrlEnterTosend setting is true in plain text editor
* changes the message event content when using the new editor
* adds tests for the changes to the plain text editor
This commit is contained in:
alunturner 2023-01-04 12:57:09 +00:00 committed by GitHub
parent 3bcea5fb0b
commit 432ce3ca31
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 336 additions and 94 deletions

View file

@ -24,7 +24,7 @@ describe("createMessageContent", () => {
return "$$permalink$$";
},
} as RoomPermalinkCreator;
const message = "<i><b>hello</b> world</i>";
const message = "<em><b>hello</b> world</em>";
const mockEvent = mkEvent({
type: "m.room.message",
room: "myfakeroom",
@ -37,31 +37,31 @@ describe("createMessageContent", () => {
jest.resetAllMocks();
});
it("Should create html message", () => {
it("Should create html message", async () => {
// When
const content = createMessageContent(message, true, { permalinkCreator });
const content = await createMessageContent(message, true, { permalinkCreator });
// Then
expect(content).toEqual({
body: "hello world",
body: "*__hello__ world*",
format: "org.matrix.custom.html",
formatted_body: message,
msgtype: "m.text",
});
});
it("Should add reply to message content", () => {
it("Should add reply to message content", async () => {
// When
const content = createMessageContent(message, true, { permalinkCreator, replyToEvent: mockEvent });
const content = await createMessageContent(message, true, { permalinkCreator, replyToEvent: mockEvent });
// Then
expect(content).toEqual({
"body": "> <myfakeuser> Replying to this\n\nhello world",
"body": "> <myfakeuser> Replying to this\n\n*__hello__ world*",
"format": "org.matrix.custom.html",
"formatted_body":
'<mx-reply><blockquote><a href="$$permalink$$">In reply to</a>' +
' <a href="https://matrix.to/#/myfakeuser">myfakeuser</a>' +
"<br>Replying to this</blockquote></mx-reply><i><b>hello</b> world</i>",
"<br>Replying to this</blockquote></mx-reply><em><b>hello</b> world</em>",
"msgtype": "m.text",
"m.relates_to": {
"m.in_reply_to": {
@ -71,17 +71,17 @@ describe("createMessageContent", () => {
});
});
it("Should add relation to message", () => {
it("Should add relation to message", async () => {
// When
const relation = {
rel_type: "m.thread",
event_id: "myFakeThreadId",
};
const content = createMessageContent(message, true, { permalinkCreator, relation });
const content = await createMessageContent(message, true, { permalinkCreator, relation });
// Then
expect(content).toEqual({
"body": "hello world",
"body": "*__hello__ world*",
"format": "org.matrix.custom.html",
"formatted_body": message,
"msgtype": "m.text",
@ -92,7 +92,7 @@ describe("createMessageContent", () => {
});
});
it("Should add fields related to edition", () => {
it("Should add fields related to edition", async () => {
// When
const editedEvent = mkEvent({
type: "m.room.message",
@ -110,16 +110,16 @@ describe("createMessageContent", () => {
},
event: true,
});
const content = createMessageContent(message, true, { permalinkCreator, editedEvent });
const content = await createMessageContent(message, true, { permalinkCreator, editedEvent });
// Then
expect(content).toEqual({
"body": " * hello world",
"body": " * *__hello__ world*",
"format": "org.matrix.custom.html",
"formatted_body": ` * ${message}`,
"msgtype": "m.text",
"m.new_content": {
body: "hello world",
body: "*__hello__ world*",
format: "org.matrix.custom.html",
formatted_body: message,
msgtype: "m.text",

View file

@ -70,6 +70,79 @@ describe("message", () => {
expect(spyDispatcher).toBeCalledTimes(0);
});
it("Should not send message when there is no roomId", async () => {
// When
const mockRoomWithoutId = mkStubRoom("", "room without id", mockClient) as any;
const mockRoomContextWithoutId: IRoomState = getRoomContext(mockRoomWithoutId, {});
await sendMessage(message, true, {
roomContext: mockRoomContextWithoutId,
mxClient: mockClient,
permalinkCreator,
});
// Then
expect(mockClient.sendMessage).toBeCalledTimes(0);
expect(spyDispatcher).toBeCalledTimes(0);
});
describe("calls client.sendMessage with", () => {
it("a null argument if SendMessageParams is missing relation", async () => {
// When
await sendMessage(message, true, {
roomContext: defaultRoomContext,
mxClient: mockClient,
permalinkCreator,
});
// Then
expect(mockClient.sendMessage).toHaveBeenCalledWith(expect.anything(), null, expect.anything());
});
it("a null argument if SendMessageParams has relation but relation is missing event_id", async () => {
// When
await sendMessage(message, true, {
roomContext: defaultRoomContext,
mxClient: mockClient,
permalinkCreator,
relation: {},
});
// Then
expect(mockClient.sendMessage).toBeCalledWith(expect.anything(), null, expect.anything());
});
it("a null argument if SendMessageParams has relation but rel_type does not match THREAD_RELATION_TYPE.name", async () => {
// When
await sendMessage(message, true, {
roomContext: defaultRoomContext,
mxClient: mockClient,
permalinkCreator,
relation: {
event_id: "valid_id",
rel_type: "m.does_not_match",
},
});
// Then
expect(mockClient.sendMessage).toBeCalledWith(expect.anything(), null, expect.anything());
});
it("the event_id if SendMessageParams has relation and rel_type matches THREAD_RELATION_TYPE.name", async () => {
// When
await sendMessage(message, true, {
roomContext: defaultRoomContext,
mxClient: mockClient,
permalinkCreator,
relation: {
event_id: "valid_id",
rel_type: "m.thread",
},
});
// Then
expect(mockClient.sendMessage).toBeCalledWith(expect.anything(), "valid_id", expect.anything());
});
});
it("Should send html message", async () => {
// When
await sendMessage(message, true, {
@ -80,7 +153,7 @@ describe("message", () => {
// Then
const expectedContent = {
body: "hello world",
body: "*__hello__ world*",
format: "org.matrix.custom.html",
formatted_body: "<i><b>hello</b> world</i>",
msgtype: "m.text",
@ -114,7 +187,7 @@ describe("message", () => {
});
const expectedContent = {
"body": "> <myfakeuser2> My reply\n\nhello world",
"body": "> <myfakeuser2> My reply\n\n*__hello__ world*",
"format": "org.matrix.custom.html",
"formatted_body":
'<mx-reply><blockquote><a href="$$permalink$$">In reply to</a>' +