Hide indent button in rte (#10149)
* add conditional rendering for indent and unindent buttons * bump rte to 1.1.1
This commit is contained in:
parent
49e0228fa0
commit
18c9b2bed2
4 changed files with 48 additions and 21 deletions
|
@ -15,7 +15,7 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import React from "react";
|
||||
import { render, screen } from "@testing-library/react";
|
||||
import { cleanup, render, screen } from "@testing-library/react";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
import { ActionState, ActionTypes, AllActionStates, FormattingFunctions } from "@matrix-org/matrix-wysiwyg";
|
||||
|
||||
|
@ -40,7 +40,7 @@ const mockWysiwyg = {
|
|||
const openLinkModalSpy = jest.spyOn(LinkModal, "openLinkModal");
|
||||
|
||||
const testCases: Record<
|
||||
Exclude<ActionTypes, "undo" | "redo" | "clear">,
|
||||
Exclude<ActionTypes, "undo" | "redo" | "clear" | "indent" | "unindent">,
|
||||
{ label: string; mockFormatFn: jest.Func | jest.SpyInstance }
|
||||
> = {
|
||||
bold: { label: "Bold", mockFormatFn: mockWysiwyg.bold },
|
||||
|
@ -53,8 +53,6 @@ const testCases: Record<
|
|||
orderedList: { label: "Numbered list", mockFormatFn: mockWysiwyg.orderedList },
|
||||
unorderedList: { label: "Bulleted list", mockFormatFn: mockWysiwyg.unorderedList },
|
||||
quote: { label: "Quote", mockFormatFn: mockWysiwyg.quote },
|
||||
indent: { label: "Indent increase", mockFormatFn: mockWysiwyg.indent },
|
||||
unIndent: { label: "Indent decrease", mockFormatFn: mockWysiwyg.unIndent },
|
||||
};
|
||||
|
||||
const createActionStates = (state: ActionState): AllActionStates => {
|
||||
|
@ -162,4 +160,28 @@ describe("FormattingButtons", () => {
|
|||
expect(screen.getByLabelText(label)).not.toHaveClass("mx_FormattingButtons_Button_hover");
|
||||
}
|
||||
});
|
||||
|
||||
it("Does not show indent or unindent button when outside a list", () => {
|
||||
renderComponent();
|
||||
|
||||
expect(screen.queryByLabelText("Indent increase")).not.toBeInTheDocument();
|
||||
expect(screen.queryByLabelText("Indent decrease")).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("Shows indent and unindent buttons when either a single list type is 'reversed'", () => {
|
||||
const orderedListActive = { ...defaultActionStates, orderedList: "reversed" };
|
||||
renderComponent({ actionStates: orderedListActive });
|
||||
|
||||
expect(screen.getByLabelText("Indent increase")).toBeInTheDocument();
|
||||
expect(screen.getByLabelText("Indent decrease")).toBeInTheDocument();
|
||||
|
||||
cleanup();
|
||||
|
||||
const unorderedListActive = { ...defaultActionStates, unorderedList: "reversed" };
|
||||
|
||||
renderComponent({ actionStates: unorderedListActive });
|
||||
|
||||
expect(screen.getByLabelText("Indent increase")).toBeInTheDocument();
|
||||
expect(screen.getByLabelText("Indent decrease")).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue