Fix bug in "Wrap selection in tag" command (#316)

.changeset/young-turkeys-turn.md

@@ -0,0 +1,5 @@
+---
+'playroom': patch
+---
+
+Fix bug in "Wrap selection in tag" command that caused the start cursor to occasionally be placed in the wrong postion.

cypress/e2e/keymaps.cy.js

@@ -216,6 +216,21 @@ describe('Keymaps', () => {
       `);
     });
 
+    it('should ignore surrounding whitespace when wrapping a single line selection', () => {
+      typeCode(' ');
+      typeCode('{leftArrow}');
+      selectToEndOfLine();
+
+      typeCode(`{shift+${modifierKey}+,}`);
+      typeCode('span');
+
+      assertCodePaneContains(dedent`
+        <span> <div>First line</div></span>
+        <div>Second line</div>
+        <div>Third line</div>
+      `);
+    });
+
     it('should wrap a multi-line selection', () => {
       typeCode('{shift+downArrow}');
       selectToEndOfLine();

src/Playroom/CodeEditor/keymaps/wrap.ts

@@ -36,10 +36,13 @@ export const wrapInTag = (cm: Editor) => {
       existingIndent,
     });
 
+    const startCursorCharacterPosition =
+      from.ch + 1 + (isMultiLineSelection ? existingIndent : 0);
     const newStartCursor = new Pos(
       from.line + linesAdded,
-      from.ch + existingIndent + 1
+      startCursorCharacterPosition
     );
+
     const newEndCursor = isMultiLineSelection
       ? new Pos(to.line + linesAdded + 2, from.ch + existingIndent + 2)
       : new Pos(to.line + linesAdded, to.ch + 4);