Commit 65de10ec authored by Johann Hubert Sonntagbauer's avatar Johann Hubert Sonntagbauer Committed by Kushal Pandya

Refine cursor positioning in Markdown Editor for wrap tags.

parent d4a5c8e2
......@@ -39,7 +39,7 @@ function blockTagText(text, textArea, blockTag, selected) {
}
}
function moveCursor({ textArea, tag, wrapped, removedLastNewLine, select }) {
function moveCursor({ textArea, tag, positionBetweenTags, removedLastNewLine, select }) {
var pos;
if (!textArea.setSelectionRange) {
return;
......@@ -51,7 +51,7 @@ function moveCursor({ textArea, tag, wrapped, removedLastNewLine, select }) {
return textArea.setSelectionRange(startPosition, endPosition);
}
if (textArea.selectionStart === textArea.selectionEnd) {
if (wrapped) {
if (positionBetweenTags) {
pos = textArea.selectionStart - tag.length;
} else {
pos = textArea.selectionStart;
......@@ -67,7 +67,6 @@ function moveCursor({ textArea, tag, wrapped, removedLastNewLine, select }) {
export function insertMarkdownText({ textArea, text, tag, blockTag, selected, wrap, select }) {
var textToInsert,
inserted,
selectedSplit,
startChar,
removedLastNewLine,
......@@ -155,7 +154,7 @@ export function insertMarkdownText({ textArea, text, tag, blockTag, selected, wr
return moveCursor({
textArea,
tag: tag.replace(textPlaceholder, selected),
wrap,
positionBetweenTags: wrap && selected.length === 0,
removedLastNewLine,
select,
});
......@@ -171,10 +170,6 @@ function updateText({ textArea, tag, blockTag, wrap, select }) {
return insertMarkdownText({ textArea, text, tag, blockTag, selected, wrap, select });
}
function replaceRange(s, start, end, substitute) {
return s.substring(0, start) + substitute + s.substring(end);
}
export function addMarkdownListeners(form) {
return $('.js-md', form)
.off('click')
......
---
title: Refine cursor positioning in Markdown Editor for wrap tags
merge_request: 23085
author: Johann Hubert Sonntagbauer
type: changed
......@@ -86,6 +86,29 @@ describe('init markdown', () => {
expect(textArea.value).toEqual(`${initialValue}* `);
});
it('places the cursor inside the tags', () => {
const start = 'lorem ';
const end = ' ipsum';
const tag = '*';
textArea.value = `${start}${end}`;
textArea.setSelectionRange(start.length, start.length);
insertMarkdownText({
textArea,
text: textArea.value,
tag,
blockTag: null,
selected: '',
wrap: true,
});
expect(textArea.value).toEqual(`${start}**${end}`);
// cursor placement should be between tags
expect(textArea.selectionStart).toBe(start.length + tag.length);
});
});
describe('with selection', () => {
......@@ -98,16 +121,22 @@ describe('init markdown', () => {
});
it('applies the tag to the selected value', () => {
const selectedIndex = text.indexOf(selected);
const tag = '*';
insertMarkdownText({
textArea,
text: textArea.value,
tag: '*',
tag,
blockTag: null,
selected,
wrap: true,
});
expect(textArea.value).toEqual(text.replace(selected, `*${selected}*`));
// cursor placement should be after selection + 2 tag lengths
expect(textArea.selectionStart).toBe(selectedIndex + selected.length + 2 * tag.length);
});
it('replaces the placeholder in the tag', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment