Skip to content
This repository was archived by the owner on Oct 11, 2022. It is now read-only.

if inline style was applied by other plugin md plugin should not unst… #141

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
102 changes: 66 additions & 36 deletions src/__test__/plugin-new.test.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
import Draft, {
EditorState,
SelectionState,
ContentBlock,
convertToRaw,
} from "draft-js";
import Draft, { EditorState, SelectionState, convertToRaw } from "draft-js";
import createMarkdownPlugin from "../";
import { applyMDtoInlineStyleChange } from "./utils";

describe("markdown", () => {
it("should convert asteriks to bold text", () => {
Expand Down Expand Up @@ -76,15 +72,14 @@ describe("markdown", () => {
);
});

it("should not have sticky inline styles", () => {
it("should not unstick inline styles if they were not added by md-to-inline-style change", () => {
const { handleBeforeInput } = createMarkdownPlugin();
const setEditorState = jest.fn();
const boldInlineStyleRange = {
length: 4,
offset: 5,
style: "BOLD",
};
const before = EditorState.moveSelectionToEnd(
const editorState = EditorState.moveSelectionToEnd(
EditorState.createWithContent(
Draft.convertFromRaw({
entityMap: {},
Expand All @@ -102,7 +97,39 @@ describe("markdown", () => {
})
)
);
expect(handleBeforeInput("a", before, { setEditorState })).toEqual(
expect(handleBeforeInput("a", editorState, {})).toEqual("not-handled");
});

it("should not have sticky inline styles", () => {
const { handleBeforeInput } = createMarkdownPlugin();
const setEditorState = jest.fn();
const boldInlineStyleRange = {
length: 4,
offset: 5,
style: "BOLD",
};
const editorState = applyMDtoInlineStyleChange(
EditorState.moveSelectionToEnd(
EditorState.createWithContent(
Draft.convertFromRaw({
entityMap: {},
blocks: [
{
key: "item1",
text: "Some text",
type: "unstyled",
depth: 0,
inlineStyleRanges: [boldInlineStyleRange],
entityRanges: [],
data: {},
},
],
})
)
)
);

expect(handleBeforeInput("a", editorState, { setEditorState })).toEqual(
"handled"
);
const raw = convertToRaw(
Expand All @@ -120,34 +147,37 @@ describe("markdown", () => {
offset: 5,
style: "BOLD",
};
const before = EditorState.moveSelectionToEnd(
EditorState.createWithContent(
Draft.convertFromRaw({
entityMap: {},
blocks: [
{
key: "item1",
text: "Some text",
type: "unstyled",
depth: 0,
inlineStyleRanges: [boldInlineStyleRange],
entityRanges: [],
data: {},
},
{
key: "item2",
text: "",
type: "unstyled",
depth: 0,
inlineStyleRanges: [],
entityRanges: [],
data: {},
},
],
})
const editorState = applyMDtoInlineStyleChange(
EditorState.moveSelectionToEnd(
EditorState.createWithContent(
Draft.convertFromRaw({
entityMap: {},
blocks: [
{
key: "item1",
text: "Some text",
type: "unstyled",
depth: 0,
inlineStyleRanges: [boldInlineStyleRange],
entityRanges: [],
data: {},
},
{
key: "item2",
text: "",
type: "unstyled",
depth: 0,
inlineStyleRanges: [],
entityRanges: [],
data: {},
},
],
})
)
)
);
expect(handleBeforeInput("a", before, { setEditorState })).toEqual(

expect(handleBeforeInput("a", editorState, { setEditorState })).toEqual(
"handled"
);
const raw = convertToRaw(
Expand Down
13 changes: 10 additions & 3 deletions src/__test__/plugin.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {
CheckableListItem,
CheckableListItemUtils,
} from "draft-js-checkable-list-item";
import { applyMDtoInlineStyleChange } from "./utils";

import {
defaultInlineWhitelist,
Expand Down Expand Up @@ -474,8 +475,12 @@ describe("draft-js-markdown-plugin", () => {
let character;
beforeEach(() => {
character = " ";
subject = () =>
plugin.handleBeforeInput(character, store.getEditorState(), store);
subject = editorState =>
plugin.handleBeforeInput(
character,
editorState || store.getEditorState(),
store
);
currentRawContentState = {
entityMap: {},
blocks: [
Expand Down Expand Up @@ -572,7 +577,9 @@ describe("draft-js-markdown-plugin", () => {
anchorOffset: 5,
});

expect(subject()).toBe("handled");
expect(
subject(applyMDtoInlineStyleChange(store.getEditorState()))
).toBe("handled");
expect(store.setEditorState).toHaveBeenCalled();
newEditorState = store.setEditorState.mock.calls[0][0];
const block = newEditorState.getCurrentContent().getLastBlock();
Expand Down
6 changes: 6 additions & 0 deletions src/__test__/utils.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import { EditorState } from "draft-js";

export const applyMDtoInlineStyleChange = editorState =>
EditorState.set(editorState, {
lastChangeType: "md-to-inline-style",
});
3 changes: 3 additions & 0 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -205,6 +205,9 @@ function checkReturnForState(config, editorState, ev) {
const unstickyInlineStyles = (character, editorState) => {
const selection = editorState.getSelection();
if (!selection.isCollapsed()) return editorState;
if (editorState.getLastChangeType() !== "md-to-inline-style") {
return editorState;
}

const startOffset = selection.getStartOffset();
const content = editorState.getCurrentContent();
Expand Down
2 changes: 1 addition & 1 deletion src/modifiers/handleInlineStyle.js
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ const handleInlineStyle = (
newEditorState = EditorState.push(
newEditorState,
newContentState,
"change-inline-style"
"md-to-inline-style"
);

return newEditorState;
Expand Down