| |
| |
| |
| |
| |
|
|
| import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'; |
| import stripAnsi from 'strip-ansi'; |
| import { act } from 'react'; |
| import * as fs from 'node:fs'; |
| import * as path from 'node:path'; |
| import * as os from 'node:os'; |
| import { |
| renderHook, |
| renderHookWithProviders, |
| } from '../../../test-utils/render.js'; |
|
|
| import type { |
| Viewport, |
| TextBuffer, |
| TextBufferState, |
| TextBufferAction, |
| Transformation, |
| VisualLayout, |
| TextBufferOptions, |
| } from './text-buffer.js'; |
| import { |
| useTextBuffer, |
| offsetToLogicalPos, |
| logicalPosToOffset, |
| textBufferReducer, |
| findWordEndInLine, |
| findNextWordStartInLine, |
| findNextBigWordStartInLine, |
| findPrevBigWordStartInLine, |
| findBigWordEndInLine, |
| isWordCharStrict, |
| calculateTransformationsForLine, |
| calculateTransformedLine, |
| getTransformUnderCursor, |
| getTransformedImagePath, |
| } from './text-buffer.js'; |
| import { cpLen } from '../../utils/textUtils.js'; |
| import { type Key } from '../../hooks/useKeypress.js'; |
| import { escapePath } from '@google/gemini-cli-core'; |
|
|
| vi.mock('../../contexts/SettingsContext.js', async (importOriginal) => { |
| const actual = |
| await importOriginal<typeof import('../../contexts/SettingsContext.js')>(); |
| return { |
| ...actual, |
| useSettings: () => ({ |
| merged: { general: { openEditorInNewWindow: false } }, |
| }), |
| }; |
| }); |
|
|
| const defaultVisualLayout: VisualLayout = { |
| visualLines: [''], |
| logicalToVisualMap: [[[0, 0]]], |
| visualToLogicalMap: [[0, 0]], |
| transformedToLogicalMaps: [[]], |
| visualToTransformedMap: [], |
| }; |
|
|
| const initialState: TextBufferState = { |
| lines: [''], |
| cursorRow: 0, |
| cursorCol: 0, |
| preferredCol: null, |
| undoStack: [], |
| redoStack: [], |
| clipboard: null, |
| selectionAnchor: null, |
| viewportWidth: 80, |
| viewportHeight: 24, |
| transformationsByLine: [[]], |
| visualLayout: defaultVisualLayout, |
| pastedContent: {}, |
| expandedPaste: null, |
| yankRegister: null, |
| }; |
|
|
| |
| |
| |
| function createStateWithTransformations( |
| partial: Partial<TextBufferState>, |
| ): TextBufferState { |
| const state = { ...initialState, ...partial }; |
| return { |
| ...state, |
| transformationsByLine: state.lines.map((l) => |
| calculateTransformationsForLine(l), |
| ), |
| }; |
| } |
|
|
| describe('textBufferReducer', () => { |
| afterEach(() => { |
| vi.restoreAllMocks(); |
| }); |
|
|
| it('should return the initial state if state is undefined', async () => { |
| const action = { type: 'unknown_action' } as unknown as TextBufferAction; |
| const state = textBufferReducer(initialState, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state).toEqual(initialState); |
| }); |
|
|
| describe('Big Word Navigation Helpers', () => { |
| describe('findNextBigWordStartInLine (W)', () => { |
| it('should skip non-whitespace and then whitespace', async () => { |
| expect(findNextBigWordStartInLine('hello world', 0)).toBe(6); |
| expect(findNextBigWordStartInLine('hello.world test', 0)).toBe(12); |
| expect(findNextBigWordStartInLine(' test', 0)).toBe(3); |
| expect(findNextBigWordStartInLine('test ', 0)).toBe(null); |
| }); |
| }); |
|
|
| describe('findPrevBigWordStartInLine (B)', () => { |
| it('should skip whitespace backwards then non-whitespace', async () => { |
| expect(findPrevBigWordStartInLine('hello world', 6)).toBe(0); |
| expect(findPrevBigWordStartInLine('hello.world test', 12)).toBe(0); |
| expect(findPrevBigWordStartInLine(' test', 3)).toBe(null); |
| expect(findPrevBigWordStartInLine(' test', 4)).toBe(3); |
| expect(findPrevBigWordStartInLine('test ', 6)).toBe(0); |
| }); |
| }); |
|
|
| describe('findBigWordEndInLine (E)', () => { |
| it('should find end of current big word', async () => { |
| expect(findBigWordEndInLine('hello world', 0)).toBe(4); |
| expect(findBigWordEndInLine('hello.world test', 0)).toBe(10); |
| expect(findBigWordEndInLine('hello.world test', 11)).toBe(15); |
| }); |
|
|
| it('should skip whitespace if currently on whitespace', async () => { |
| expect(findBigWordEndInLine('hello world', 5)).toBe(12); |
| }); |
|
|
| it('should find next big word end if at end of current', async () => { |
| expect(findBigWordEndInLine('hello world', 4)).toBe(10); |
| }); |
| }); |
| }); |
|
|
| describe('set_text action', () => { |
| it('should set new text and move cursor to the end', async () => { |
| const action: TextBufferAction = { |
| type: 'set_text', |
| payload: 'hello\nworld', |
| }; |
| const state = textBufferReducer(initialState, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['hello', 'world']); |
| expect(state.cursorRow).toBe(1); |
| expect(state.cursorCol).toBe(5); |
| expect(state.undoStack.length).toBe(1); |
| }); |
|
|
| it('should not create an undo snapshot if pushToUndo is false', async () => { |
| const action: TextBufferAction = { |
| type: 'set_text', |
| payload: 'no undo', |
| pushToUndo: false, |
| }; |
| const state = textBufferReducer(initialState, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['no undo']); |
| expect(state.undoStack.length).toBe(0); |
| }); |
| }); |
|
|
| describe('insert action', () => { |
| it('should insert a character', async () => { |
| const action: TextBufferAction = { type: 'insert', payload: 'a' }; |
| const state = textBufferReducer(initialState, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['a']); |
| expect(state.cursorCol).toBe(1); |
| }); |
|
|
| it('should insert a newline', async () => { |
| const stateWithText = { ...initialState, lines: ['hello'] }; |
| const action: TextBufferAction = { type: 'insert', payload: '\n' }; |
| const state = textBufferReducer(stateWithText, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['', 'hello']); |
| expect(state.cursorRow).toBe(1); |
| expect(state.cursorCol).toBe(0); |
| }); |
| }); |
|
|
| describe('insert action with options', () => { |
| it('should filter input using inputFilter option', async () => { |
| const action: TextBufferAction = { type: 'insert', payload: 'a1b2c3' }; |
| const options: TextBufferOptions = { |
| inputFilter: (text) => text.replace(/[0-9]/g, ''), |
| }; |
| const state = textBufferReducer(initialState, action, options); |
| expect(state.lines).toEqual(['abc']); |
| expect(state.cursorCol).toBe(3); |
| }); |
|
|
| it('should strip newlines when singleLine option is true', async () => { |
| const action: TextBufferAction = { |
| type: 'insert', |
| payload: 'hello\nworld', |
| }; |
| const options: TextBufferOptions = { singleLine: true }; |
| const state = textBufferReducer(initialState, action, options); |
| expect(state.lines).toEqual(['helloworld']); |
| expect(state.cursorCol).toBe(10); |
| }); |
|
|
| it('should apply both inputFilter and singleLine options', async () => { |
| const action: TextBufferAction = { |
| type: 'insert', |
| payload: 'h\ne\nl\nl\no\n1\n2\n3', |
| }; |
| const options: TextBufferOptions = { |
| singleLine: true, |
| inputFilter: (text) => text.replace(/[0-9]/g, ''), |
| }; |
| const state = textBufferReducer(initialState, action, options); |
| expect(state.lines).toEqual(['hello']); |
| expect(state.cursorCol).toBe(5); |
| }); |
| }); |
|
|
| describe('add_pasted_content action', () => { |
| it('should add content to pastedContent Record', async () => { |
| const action: TextBufferAction = { |
| type: 'add_pasted_content', |
| payload: { id: '[Pasted Text: 6 lines]', text: 'large content' }, |
| }; |
| const state = textBufferReducer(initialState, action); |
| expect(state.pastedContent).toEqual({ |
| '[Pasted Text: 6 lines]': 'large content', |
| }); |
| }); |
| }); |
|
|
| describe('backspace action', () => { |
| it('should remove a character', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['a'], |
| cursorRow: 0, |
| cursorCol: 1, |
| }; |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithText, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| }); |
|
|
| it('should join lines if at the beginning of a line', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['hello', 'world'], |
| cursorRow: 1, |
| cursorCol: 0, |
| }; |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithText, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['helloworld']); |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(5); |
| }); |
| }); |
|
|
| describe('atomic placeholder deletion', () => { |
| describe('paste placeholders', () => { |
| it('backspace at end of paste placeholder removes entire placeholder', async () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [placeholder], |
| cursorRow: 0, |
| cursorCol: placeholder.length, |
| pastedContent: { |
| [placeholder]: 'line1\nline2\nline3\nline4\nline5\nline6', |
| }, |
| }); |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithPlaceholder, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| |
| expect(state.pastedContent[placeholder]).toBeUndefined(); |
| }); |
|
|
| it('delete at start of paste placeholder removes entire placeholder', async () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [placeholder], |
| cursorRow: 0, |
| cursorCol: 0, |
| pastedContent: { |
| [placeholder]: 'line1\nline2\nline3\nline4\nline5\nline6', |
| }, |
| }); |
| const action: TextBufferAction = { type: 'delete' }; |
| const state = textBufferReducer(stateWithPlaceholder, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| |
| expect(state.pastedContent[placeholder]).toBeUndefined(); |
| }); |
|
|
| it('backspace inside paste placeholder does normal deletion', async () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [placeholder], |
| cursorRow: 0, |
| cursorCol: 10, |
| pastedContent: { |
| [placeholder]: 'line1\nline2\nline3\nline4\nline5\nline6', |
| }, |
| }); |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithPlaceholder, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| |
| expect(state.lines[0].length).toBe(placeholder.length - 1); |
| expect(state.cursorCol).toBe(9); |
| |
| expect(state.pastedContent[placeholder]).toBeDefined(); |
| }); |
| }); |
|
|
| describe('image placeholders', () => { |
| it('backspace at end of image path removes entire path', async () => { |
| const imagePath = '@test.png'; |
| const stateWithImage = createStateWithTransformations({ |
| lines: [imagePath], |
| cursorRow: 0, |
| cursorCol: imagePath.length, |
| }); |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithImage, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| }); |
|
|
| it('delete at start of image path removes entire path', async () => { |
| const imagePath = '@test.png'; |
| const stateWithImage = createStateWithTransformations({ |
| lines: [imagePath], |
| cursorRow: 0, |
| cursorCol: 0, |
| }); |
| const action: TextBufferAction = { type: 'delete' }; |
| const state = textBufferReducer(stateWithImage, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| }); |
|
|
| it('backspace inside image path does normal deletion', async () => { |
| const imagePath = '@test.png'; |
| const stateWithImage = createStateWithTransformations({ |
| lines: [imagePath], |
| cursorRow: 0, |
| cursorCol: 5, |
| }); |
| const action: TextBufferAction = { type: 'backspace' }; |
| const state = textBufferReducer(stateWithImage, action); |
| expect(state).toHaveOnlyValidCharacters(); |
| |
| expect(state.lines[0].length).toBe(imagePath.length - 1); |
| expect(state.cursorCol).toBe(4); |
| }); |
| }); |
|
|
| describe('undo behavior', () => { |
| it('undo after placeholder deletion restores everything', async () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const pasteContent = 'line1\nline2\nline3\nline4\nline5\nline6'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [placeholder], |
| cursorRow: 0, |
| cursorCol: placeholder.length, |
| pastedContent: { [placeholder]: pasteContent }, |
| }); |
|
|
| |
| const deleteAction: TextBufferAction = { type: 'backspace' }; |
| const stateAfterDelete = textBufferReducer( |
| stateWithPlaceholder, |
| deleteAction, |
| ); |
| expect(stateAfterDelete.lines).toEqual(['']); |
| expect(stateAfterDelete.pastedContent[placeholder]).toBeUndefined(); |
|
|
| |
| const undoAction: TextBufferAction = { type: 'undo' }; |
| const stateAfterUndo = textBufferReducer(stateAfterDelete, undoAction); |
| expect(stateAfterUndo).toHaveOnlyValidCharacters(); |
| expect(stateAfterUndo.lines).toEqual([placeholder]); |
| expect(stateAfterUndo.pastedContent[placeholder]).toBe(pasteContent); |
| }); |
| }); |
| }); |
|
|
| describe('undo/redo actions', () => { |
| it('should undo and redo a change', async () => { |
| |
| const insertAction: TextBufferAction = { |
| type: 'insert', |
| payload: 'test', |
| }; |
| const stateAfterInsert = textBufferReducer(initialState, insertAction); |
| expect(stateAfterInsert).toHaveOnlyValidCharacters(); |
| expect(stateAfterInsert.lines).toEqual(['test']); |
| expect(stateAfterInsert.undoStack.length).toBe(1); |
|
|
| |
| const undoAction: TextBufferAction = { type: 'undo' }; |
| const stateAfterUndo = textBufferReducer(stateAfterInsert, undoAction); |
| expect(stateAfterUndo).toHaveOnlyValidCharacters(); |
| expect(stateAfterUndo.lines).toEqual(['']); |
| expect(stateAfterUndo.undoStack.length).toBe(0); |
| expect(stateAfterUndo.redoStack.length).toBe(1); |
|
|
| |
| const redoAction: TextBufferAction = { type: 'redo' }; |
| const stateAfterRedo = textBufferReducer(stateAfterUndo, redoAction); |
| expect(stateAfterRedo).toHaveOnlyValidCharacters(); |
| expect(stateAfterRedo.lines).toEqual(['test']); |
| expect(stateAfterRedo.undoStack.length).toBe(1); |
| expect(stateAfterRedo.redoStack.length).toBe(0); |
| }); |
| }); |
|
|
| describe('create_undo_snapshot action', () => { |
| it('should create a snapshot without changing state', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['hello'], |
| cursorRow: 0, |
| cursorCol: 5, |
| }; |
| const action: TextBufferAction = { type: 'create_undo_snapshot' }; |
| const state = textBufferReducer(stateWithText, action); |
| expect(state).toHaveOnlyValidCharacters(); |
|
|
| expect(state.lines).toEqual(['hello']); |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(5); |
| expect(state.undoStack.length).toBe(1); |
| expect(state.undoStack[0].lines).toEqual(['hello']); |
| expect(state.undoStack[0].cursorRow).toBe(0); |
| expect(state.undoStack[0].cursorCol).toBe(5); |
| }); |
| }); |
|
|
| describe('delete_word_left action', () => { |
| const createSingleLineState = ( |
| text: string, |
| col: number, |
| ): TextBufferState => ({ |
| ...initialState, |
| lines: [text], |
| cursorRow: 0, |
| cursorCol: col, |
| }); |
|
|
| it.each([ |
| { |
| input: 'hello world', |
| cursorCol: 11, |
| expectedLines: ['hello '], |
| expectedCol: 6, |
| desc: 'simple word', |
| }, |
| { |
| input: 'path/to/file', |
| cursorCol: 12, |
| expectedLines: ['path/to/'], |
| expectedCol: 8, |
| desc: 'path segment', |
| }, |
| { |
| input: 'variable_name', |
| cursorCol: 13, |
| expectedLines: ['variable_'], |
| expectedCol: 9, |
| desc: 'variable_name parts', |
| }, |
| ])( |
| 'should delete $desc', |
| ({ input, cursorCol, expectedLines, expectedCol }) => { |
| const state = textBufferReducer( |
| createSingleLineState(input, cursorCol), |
| { type: 'delete_word_left' }, |
| ); |
| expect(state.lines).toEqual(expectedLines); |
| expect(state.cursorCol).toBe(expectedCol); |
| }, |
| ); |
|
|
| it('should act like backspace at the beginning of a line', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['hello', 'world'], |
| cursorRow: 1, |
| cursorCol: 0, |
| }; |
| const state = textBufferReducer(stateWithText, { |
| type: 'delete_word_left', |
| }); |
| expect(state.lines).toEqual(['helloworld']); |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(5); |
| }); |
| }); |
|
|
| describe('delete_word_right action', () => { |
| const createSingleLineState = ( |
| text: string, |
| col: number, |
| ): TextBufferState => ({ |
| ...initialState, |
| lines: [text], |
| cursorRow: 0, |
| cursorCol: col, |
| }); |
|
|
| it.each([ |
| { |
| input: 'hello world', |
| cursorCol: 0, |
| expectedLines: ['world'], |
| expectedCol: 0, |
| desc: 'simple word', |
| }, |
| { |
| input: 'variable_name', |
| cursorCol: 0, |
| expectedLines: ['_name'], |
| expectedCol: 0, |
| desc: 'variable_name parts', |
| }, |
| ])( |
| 'should delete $desc', |
| ({ input, cursorCol, expectedLines, expectedCol }) => { |
| const state = textBufferReducer( |
| createSingleLineState(input, cursorCol), |
| { type: 'delete_word_right' }, |
| ); |
| expect(state.lines).toEqual(expectedLines); |
| expect(state.cursorCol).toBe(expectedCol); |
| }, |
| ); |
|
|
| it('should delete path segments progressively', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['path/to/file'], |
| cursorRow: 0, |
| cursorCol: 0, |
| }; |
| let state = textBufferReducer(stateWithText, { |
| type: 'delete_word_right', |
| }); |
| expect(state.lines).toEqual(['/to/file']); |
| state = textBufferReducer(state, { type: 'delete_word_right' }); |
| expect(state.lines).toEqual(['to/file']); |
| }); |
|
|
| it('should act like delete at the end of a line', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['hello', 'world'], |
| cursorRow: 0, |
| cursorCol: 5, |
| }; |
| const state = textBufferReducer(stateWithText, { |
| type: 'delete_word_right', |
| }); |
| expect(state.lines).toEqual(['helloworld']); |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(5); |
| }); |
| }); |
|
|
| describe('kill_line_left action', () => { |
| it('should clean up pastedContent when deleting a placeholder line-left', async () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [placeholder], |
| cursorRow: 0, |
| cursorCol: cpLen(placeholder), |
| pastedContent: { |
| [placeholder]: 'line1\nline2\nline3\nline4\nline5\nline6', |
| }, |
| }); |
|
|
| const state = textBufferReducer(stateWithPlaceholder, { |
| type: 'kill_line_left', |
| }); |
|
|
| expect(state.lines).toEqual(['']); |
| expect(state.cursorCol).toBe(0); |
| expect(Object.keys(state.pastedContent)).toHaveLength(0); |
| }); |
| }); |
|
|
| describe('kill_line_right action', () => { |
| it('should reset preferredCol when deleting to end of line', async () => { |
| const stateWithText: TextBufferState = { |
| ...initialState, |
| lines: ['hello world'], |
| cursorRow: 0, |
| cursorCol: 5, |
| preferredCol: 9, |
| }; |
|
|
| const state = textBufferReducer(stateWithText, { |
| type: 'kill_line_right', |
| }); |
|
|
| expect(state.lines).toEqual(['hello']); |
| expect(state.preferredCol).toBe(null); |
| }); |
| }); |
|
|
| describe('toggle_paste_expansion action', () => { |
| const placeholder = '[Pasted Text: 6 lines]'; |
| const content = 'line1\nline2\nline3\nline4\nline5\nline6'; |
|
|
| it('should expand a placeholder correctly', async () => { |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: ['prefix ' + placeholder + ' suffix'], |
| cursorRow: 0, |
| cursorCol: 0, |
| pastedContent: { [placeholder]: content }, |
| }); |
|
|
| const action: TextBufferAction = { |
| type: 'toggle_paste_expansion', |
| payload: { id: placeholder, row: 0, col: 7 }, |
| }; |
|
|
| const state = textBufferReducer(stateWithPlaceholder, action); |
|
|
| expect(state.lines).toEqual([ |
| 'prefix line1', |
| 'line2', |
| 'line3', |
| 'line4', |
| 'line5', |
| 'line6 suffix', |
| ]); |
| expect(state.expandedPaste?.id).toBe(placeholder); |
| const info = state.expandedPaste; |
| expect(info).toEqual({ |
| id: placeholder, |
| startLine: 0, |
| lineCount: 6, |
| prefix: 'prefix ', |
| suffix: ' suffix', |
| }); |
| |
| expect(state.cursorRow).toBe(5); |
| expect(state.cursorCol).toBe(5); |
| }); |
|
|
| it('should collapse an expanded placeholder correctly', async () => { |
| const expandedState = createStateWithTransformations({ |
| lines: [ |
| 'prefix line1', |
| 'line2', |
| 'line3', |
| 'line4', |
| 'line5', |
| 'line6 suffix', |
| ], |
| cursorRow: 5, |
| cursorCol: 5, |
| pastedContent: { [placeholder]: content }, |
| expandedPaste: { |
| id: placeholder, |
| startLine: 0, |
| lineCount: 6, |
| prefix: 'prefix ', |
| suffix: ' suffix', |
| }, |
| }); |
|
|
| const action: TextBufferAction = { |
| type: 'toggle_paste_expansion', |
| payload: { id: placeholder, row: 0, col: 7 }, |
| }; |
|
|
| const state = textBufferReducer(expandedState, action); |
|
|
| expect(state.lines).toEqual(['prefix ' + placeholder + ' suffix']); |
| expect(state.expandedPaste).toBeNull(); |
| |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(('prefix ' + placeholder).length); |
| }); |
|
|
| it('should expand single-line content correctly', async () => { |
| const singleLinePlaceholder = '[Pasted Text: 10 chars]'; |
| const singleLineContent = 'some text'; |
| const stateWithPlaceholder = createStateWithTransformations({ |
| lines: [singleLinePlaceholder], |
| cursorRow: 0, |
| cursorCol: 0, |
| pastedContent: { [singleLinePlaceholder]: singleLineContent }, |
| }); |
|
|
| const state = textBufferReducer(stateWithPlaceholder, { |
| type: 'toggle_paste_expansion', |
| payload: { id: singleLinePlaceholder, row: 0, col: 0 }, |
| }); |
|
|
| expect(state.lines).toEqual(['some text']); |
| expect(state.cursorRow).toBe(0); |
| expect(state.cursorCol).toBe(9); |
| }); |
|
|
| it('should return current state if placeholder ID not found in pastedContent', async () => { |
| const action: TextBufferAction = { |
| type: 'toggle_paste_expansion', |
| payload: { id: 'unknown', row: 0, col: 0 }, |
| }; |
| const state = textBufferReducer(initialState, action); |
| expect(state).toBe(initialState); |
| }); |
|
|
| it('should preserve expandedPaste when lines change from edits outside the region', async () => { |
| |
| const placeholder = '[Pasted Text: 3 lines]'; |
| const expandedState = createStateWithTransformations({ |
| lines: ['line1', 'line2', 'line3', 'suffix'], |
| cursorRow: 3, |
| cursorCol: 0, |
| pastedContent: { [placeholder]: 'line1\nline2\nline3' }, |
| expandedPaste: { |
| id: placeholder, |
| startLine: 0, |
| lineCount: 3, |
| prefix: '', |
| suffix: '', |
| }, |
| }); |
|
|
| expect(expandedState.expandedPaste).not.toBeNull(); |
|
|
| |
| const stateAfterInsert = textBufferReducer(expandedState, { |
| type: 'insert', |
| payload: '\n', |
| }); |
|
|
| |
| expect(stateAfterInsert.expandedPaste).not.toBeNull(); |
| expect(stateAfterInsert.expandedPaste?.id).toBe(placeholder); |
| }); |
| }); |
| }); |
|
|
| const getBufferState = (result: { current: TextBuffer }) => { |
| expect(result.current).toHaveOnlyValidCharacters(); |
| return { |
| text: result.current.text, |
| lines: [...result.current.lines], |
| cursor: [...result.current.cursor] as [number, number], |
| allVisualLines: [...result.current.allVisualLines], |
| viewportVisualLines: [...result.current.viewportVisualLines], |
| visualCursor: [...result.current.visualCursor] as [number, number], |
| visualScrollRow: result.current.visualScrollRow, |
| preferredCol: result.current.preferredCol, |
| }; |
| }; |
|
|
| describe('useTextBuffer', () => { |
| let viewport: Viewport; |
|
|
| beforeEach(() => { |
| viewport = { width: 10, height: 3 }; |
| }); |
|
|
| afterEach(() => { |
| vi.restoreAllMocks(); |
| }); |
|
|
| describe('Initialization', () => { |
| it('should initialize with empty text and cursor at (0,0) by default', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const state = getBufferState(result); |
| expect(state.text).toBe(''); |
| expect(state.lines).toEqual(['']); |
| expect(state.cursor).toEqual([0, 0]); |
| expect(state.allVisualLines).toEqual(['']); |
| expect(state.viewportVisualLines).toEqual(['']); |
| expect(state.visualCursor).toEqual([0, 0]); |
| expect(state.visualScrollRow).toBe(0); |
| }); |
|
|
| it('should initialize with provided initialText', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello', |
| viewport, |
| }), |
| ); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello'); |
| expect(state.lines).toEqual(['hello']); |
| expect(state.cursor).toEqual([0, 0]); |
| expect(state.allVisualLines).toEqual(['hello']); |
| expect(state.viewportVisualLines).toEqual(['hello']); |
| expect(state.visualCursor).toEqual([0, 0]); |
| }); |
|
|
| it('should initialize with initialText and initialCursorOffset', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello\nworld', |
| initialCursorOffset: 7, |
| viewport, |
| }), |
| ); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello\nworld'); |
| expect(state.lines).toEqual(['hello', 'world']); |
| expect(state.cursor).toEqual([1, 1]); |
| expect(state.allVisualLines).toEqual(['hello', 'world']); |
| expect(state.viewportVisualLines).toEqual(['hello', 'world']); |
| expect(state.visualCursor[0]).toBe(1); |
| expect(state.visualCursor[1]).toBe(1); |
| }); |
|
|
| it('should wrap visual lines', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'The quick brown fox jumps over the lazy dog.', |
| initialCursorOffset: 2, |
| viewport: { width: 15, height: 4 }, |
| }), |
| ); |
| const state = getBufferState(result); |
| expect(state.allVisualLines).toEqual([ |
| 'The quick', |
| 'brown fox', |
| 'jumps over the', |
| 'lazy dog.', |
| ]); |
| }); |
|
|
| it('should wrap visual lines with multiple spaces', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'The quick brown fox jumps over the lazy dog.', |
| viewport: { width: 15, height: 4 }, |
| }), |
| ); |
| const state = getBufferState(result); |
| |
| |
| |
| expect(state.allVisualLines).toEqual([ |
| 'The quick ', |
| 'brown fox ', |
| 'jumps over the', |
| 'lazy dog.', |
| ]); |
| }); |
|
|
| it('should wrap visual lines even without spaces', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '123456789012345ABCDEFG', |
| viewport: { width: 15, height: 2 }, |
| }), |
| ); |
| const state = getBufferState(result); |
| |
| |
| |
| expect(state.allVisualLines).toEqual(['123456789012345', 'ABCDEFG']); |
| }); |
|
|
| it('should initialize with multi-byte unicode characters and correct cursor offset', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '你好世界', |
| initialCursorOffset: 2, |
| viewport: { width: 5, height: 2 }, |
| }), |
| ); |
| const state = getBufferState(result); |
| expect(state.text).toBe('你好世界'); |
| expect(state.lines).toEqual(['你好世界']); |
| expect(state.cursor).toEqual([0, 2]); |
| |
| expect(state.allVisualLines).toEqual(['你好', '世界']); |
| expect(state.visualCursor).toEqual([1, 0]); |
| }); |
| }); |
|
|
| describe('Basic Editing', () => { |
| it('insert: should insert a character and update cursor', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => result.current.insert('a')); |
| let state = getBufferState(result); |
| expect(state.text).toBe('a'); |
| expect(state.cursor).toEqual([0, 1]); |
| expect(state.visualCursor).toEqual([0, 1]); |
|
|
| act(() => result.current.insert('b')); |
| state = getBufferState(result); |
| expect(state.text).toBe('ab'); |
| expect(state.cursor).toEqual([0, 2]); |
| expect(state.visualCursor).toEqual([0, 2]); |
| }); |
|
|
| it('insert: should insert text in the middle of a line', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'abc', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('right')); |
| act(() => result.current.insert('-NEW-')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('a-NEW-bc'); |
| expect(state.cursor).toEqual([0, 6]); |
| }); |
|
|
| it('insert: should use placeholder for large text paste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
| act(() => result.current.insert(largeText, { paste: true })); |
| const state = getBufferState(result); |
| expect(state.text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
| }); |
|
|
| it('insert: should NOT use placeholder for large text if NOT a paste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
| act(() => result.current.insert(largeText, { paste: false })); |
| const state = getBufferState(result); |
| expect(state.text).toBe(largeText); |
| }); |
|
|
| it('insert: should clean up pastedContent when placeholder is deleted', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| |
| act(() => result.current.setText('')); |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
| }); |
|
|
| it('insert: should clean up pastedContent when placeholder is removed via atomic backspace', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| |
| act(() => { |
| result.current.backspace(); |
| }); |
|
|
| expect(getBufferState(result).text).toBe(''); |
| |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
| }); |
|
|
| it('deleteWordLeft: should clean up pastedContent and avoid #2 suffix on repaste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| act(() => { |
| for (let i = 0; i < 12; i++) { |
| result.current.deleteWordLeft(); |
| } |
| }); |
| expect(getBufferState(result).text).toBe(''); |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
| }); |
|
|
| it('deleteWordRight: should clean up pastedContent and avoid #2 suffix on repaste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| act(() => result.current.move('home')); |
| act(() => { |
| for (let i = 0; i < 12; i++) { |
| result.current.deleteWordRight(); |
| } |
| }); |
| expect(getBufferState(result).text).not.toContain( |
| '[Pasted Text: 6 lines]', |
| ); |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toContain('[Pasted Text: 6 lines]'); |
| expect(getBufferState(result).text).not.toContain('#2'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
| }); |
|
|
| it('killLineLeft: should clean up pastedContent and avoid #2 suffix on repaste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| act(() => result.current.killLineLeft()); |
| expect(getBufferState(result).text).toBe(''); |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
| }); |
|
|
| it('killLineRight: should clean up pastedContent and avoid #2 suffix on repaste', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeText = '1\n2\n3\n4\n5\n6'; |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
|
|
| act(() => { |
| for (let i = 0; i < 40; i++) { |
| result.current.move('left'); |
| } |
| }); |
| act(() => result.current.killLineRight()); |
| expect(getBufferState(result).text).toBe(''); |
| expect(Object.keys(result.current.pastedContent)).toHaveLength(0); |
|
|
| act(() => result.current.insert(largeText, { paste: true })); |
| expect(getBufferState(result).text).toBe('[Pasted Text: 6 lines]'); |
| expect(result.current.pastedContent['[Pasted Text: 6 lines]']).toBe( |
| largeText, |
| ); |
| }); |
|
|
| it('newline: should create a new line and move cursor', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'ab', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => result.current.newline()); |
| const state = getBufferState(result); |
| expect(state.text).toBe('ab\n'); |
| expect(state.lines).toEqual(['ab', '']); |
| expect(state.cursor).toEqual([1, 0]); |
| expect(state.allVisualLines).toEqual(['ab', '']); |
| expect(state.viewportVisualLines).toEqual(['ab', '']); |
| expect(state.visualCursor).toEqual([1, 0]); |
| }); |
|
|
| it('backspace: should delete char to the left or merge lines', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'a\nb', |
| viewport, |
| }), |
| ); |
| act(() => { |
| result.current.move('down'); |
| }); |
| act(() => { |
| result.current.move('end'); |
| }); |
| act(() => result.current.backspace()); |
| let state = getBufferState(result); |
| expect(state.text).toBe('a\n'); |
| expect(state.cursor).toEqual([1, 0]); |
|
|
| act(() => result.current.backspace()); |
| state = getBufferState(result); |
| expect(state.text).toBe('a'); |
| expect(state.cursor).toEqual([0, 1]); |
| expect(state.allVisualLines).toEqual(['a']); |
| expect(state.viewportVisualLines).toEqual(['a']); |
| expect(state.visualCursor).toEqual([0, 1]); |
| }); |
|
|
| it('del: should delete char to the right or merge lines', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'a\nb', |
| viewport, |
| }), |
| ); |
| |
| act(() => result.current.del()); |
| let state = getBufferState(result); |
| expect(state.text).toBe('\nb'); |
| expect(state.cursor).toEqual([0, 0]); |
|
|
| act(() => result.current.del()); |
| state = getBufferState(result); |
| expect(state.text).toBe('b'); |
| expect(state.cursor).toEqual([0, 0]); |
| expect(state.allVisualLines).toEqual(['b']); |
| expect(state.viewportVisualLines).toEqual(['b']); |
| expect(state.visualCursor).toEqual([0, 0]); |
| }); |
| }); |
|
|
| describe('Drag and Drop File Paths', () => { |
| let tempDir: string; |
|
|
| beforeEach(() => { |
| tempDir = fs.mkdtempSync(path.join(os.tmpdir(), 'gemini-cli-test-')); |
| }); |
|
|
| afterEach(() => { |
| fs.rmSync(tempDir, { recursive: true, force: true }); |
| }); |
|
|
| it('should prepend @ to a valid file path on insert', async () => { |
| const filePath = path.join(tempDir, 'file.txt'); |
| fs.writeFileSync(filePath, ''); |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ viewport, escapePastedPaths: true }), |
| ); |
| act(() => result.current.insert(filePath, { paste: true })); |
| expect(getBufferState(result).text).toBe(`@${escapePath(filePath)} `); |
| }); |
|
|
| it('should not prepend @ to an invalid file path on insert', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const notAPath = path.join(tempDir, 'non_existent.txt'); |
| act(() => result.current.insert(notAPath, { paste: true })); |
| expect(getBufferState(result).text).toBe(notAPath); |
| }); |
|
|
| it('should handle quoted paths', async () => { |
| const filePath = path.join(tempDir, 'file.txt'); |
| fs.writeFileSync(filePath, ''); |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ viewport, escapePastedPaths: true }), |
| ); |
| const quotedPath = `'${filePath}'`; |
| act(() => result.current.insert(quotedPath, { paste: true })); |
| expect(getBufferState(result).text).toBe(`@${escapePath(filePath)} `); |
| }); |
|
|
| it('should not prepend @ to short text that is not a path', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ viewport, escapePastedPaths: true }), |
| ); |
| const shortText = 'ab'; |
| act(() => result.current.insert(shortText, { paste: true })); |
| expect(getBufferState(result).text).toBe(shortText); |
| }); |
|
|
| it('should prepend @ to multiple valid file paths on insert', async () => { |
| const file1 = path.join(tempDir, 'file1.txt'); |
| const file2 = path.join(tempDir, 'file2.txt'); |
| fs.writeFileSync(file1, ''); |
| fs.writeFileSync(file2, ''); |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ viewport, escapePastedPaths: true }), |
| ); |
| const filePaths = `${escapePath(file1)} ${escapePath(file2)}`; |
| act(() => result.current.insert(filePaths, { paste: true })); |
| expect(getBufferState(result).text).toBe( |
| `@${escapePath(file1)} @${escapePath(file2)} `, |
| ); |
| }); |
|
|
| it('should handle multiple paths with escaped spaces', async () => { |
| const file1 = path.join(tempDir, 'my file.txt'); |
| const file2 = path.join(tempDir, 'other.txt'); |
| fs.writeFileSync(file1, ''); |
| fs.writeFileSync(file2, ''); |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ viewport, escapePastedPaths: true }), |
| ); |
|
|
| const filePaths = `${escapePath(file1)} ${escapePath(file2)}`; |
|
|
| act(() => result.current.insert(filePaths, { paste: true })); |
| expect(getBufferState(result).text).toBe( |
| `@${escapePath(file1)} @${escapePath(file2)} `, |
| ); |
| }); |
|
|
| it('should not prepend @ unless all paths are valid', async () => { |
| const validFile = path.join(tempDir, 'valid.txt'); |
| const invalidFile = path.join(tempDir, 'invalid.jpg'); |
| fs.writeFileSync(validFile, ''); |
| |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
| escapePastedPaths: true, |
| }), |
| ); |
| const filePaths = `${validFile} ${invalidFile}`; |
| act(() => result.current.insert(filePaths, { paste: true })); |
| expect(getBufferState(result).text).toBe(`${validFile} ${invalidFile}`); |
| }); |
| }); |
|
|
| describe('Shell Mode Behavior', () => { |
| it('should not prepend @ to valid file paths when shellModeActive is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
| escapePastedPaths: true, |
| shellModeActive: true, |
| }), |
| ); |
| const filePath = '/path/to/a/valid/file.txt'; |
| act(() => result.current.insert(filePath, { paste: true })); |
| expect(getBufferState(result).text).toBe(filePath); |
| }); |
|
|
| it('should not prepend @ to quoted paths when shellModeActive is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
| escapePastedPaths: true, |
| shellModeActive: true, |
| }), |
| ); |
| const quotedFilePath = "'/path/to/a/valid/file.txt'"; |
| act(() => result.current.insert(quotedFilePath, { paste: true })); |
| expect(getBufferState(result).text).toBe(quotedFilePath); |
| }); |
|
|
| it('should behave normally with invalid paths when shellModeActive is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| shellModeActive: true, |
| }), |
| ); |
| const notAPath = 'this is just some text'; |
| act(() => result.current.insert(notAPath, { paste: true })); |
| expect(getBufferState(result).text).toBe(notAPath); |
| }); |
|
|
| it('should behave normally with short text when shellModeActive is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
| escapePastedPaths: true, |
| shellModeActive: true, |
| }), |
| ); |
| const shortText = 'ls'; |
| act(() => result.current.insert(shortText, { paste: true })); |
| expect(getBufferState(result).text).toBe(shortText); |
| }); |
| }); |
|
|
| describe('Cursor Movement', () => { |
| it('move: left/right should work within and across visual lines (due to wrapping)', async () => { |
| |
| |
| |
| |
| |
| |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'long line1next line2', |
| viewport: { width: 5, height: 4 }, |
| }), |
| ); |
| |
|
|
| act(() => result.current.move('right')); |
| expect(getBufferState(result).visualCursor).toEqual([0, 1]); |
| act(() => result.current.move('right')); |
| act(() => result.current.move('right')); |
| act(() => result.current.move('right')); |
| expect(getBufferState(result).visualCursor).toEqual([0, 4]); |
|
|
| act(() => result.current.move('right')); |
| expect(getBufferState(result).visualCursor).toEqual([1, 0]); |
| expect(getBufferState(result).cursor).toEqual([0, 5]); |
|
|
| act(() => result.current.move('left')); |
| expect(getBufferState(result).visualCursor).toEqual([0, 4]); |
| expect(getBufferState(result).cursor).toEqual([0, 4]); |
| }); |
|
|
| it('move: up/down should preserve preferred visual column', async () => { |
| const text = 'abcde\nxy\n12345'; |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: text, |
| viewport, |
| }), |
| ); |
| expect(result.current.allVisualLines).toEqual(['abcde', 'xy', '12345']); |
| |
| act(() => { |
| result.current.move('home'); |
| }); |
| for (let i = 0; i < 5; i++) { |
| act(() => { |
| result.current.move('right'); |
| }); |
| } |
| expect(getBufferState(result).cursor).toEqual([0, 5]); |
| expect(getBufferState(result).visualCursor).toEqual([0, 5]); |
|
|
| |
| act(() => { |
| result.current.move('down'); |
| }); |
| let state = getBufferState(result); |
| expect(state.cursor).toEqual([1, 2]); |
| expect(state.visualCursor).toEqual([1, 2]); |
| expect(state.preferredCol).toBe(5); |
|
|
| act(() => result.current.move('down')); |
| state = getBufferState(result); |
| expect(state.cursor).toEqual([2, 5]); |
| expect(state.visualCursor).toEqual([2, 5]); |
| expect(state.preferredCol).toBe(5); |
|
|
| act(() => result.current.move('left')); |
| state = getBufferState(result); |
| expect(state.preferredCol).toBe(null); |
| }); |
|
|
| it('move: home/end should go to visual line start/end', async () => { |
| const initialText = 'line one\nsecond line'; |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText, |
| viewport: { width: 5, height: 5 }, |
| }), |
| ); |
| expect(result.current.allVisualLines).toEqual([ |
| 'line', |
| 'one', |
| 'secon', |
| 'd', |
| 'line', |
| ]); |
| |
| act(() => result.current.move('down')); |
| act(() => result.current.move('right')); |
| expect(getBufferState(result).visualCursor).toEqual([1, 1]); |
|
|
| act(() => result.current.move('home')); |
| expect(getBufferState(result).visualCursor).toEqual([1, 0]); |
|
|
| act(() => result.current.move('end')); |
| expect(getBufferState(result).visualCursor).toEqual([1, 3]); |
| }); |
| }); |
|
|
| describe('Visual Layout & Viewport', () => { |
| it('should wrap long lines correctly into visualLines', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'This is a very long line of text.', |
| viewport: { width: 10, height: 5 }, |
| }), |
| ); |
| const state = getBufferState(result); |
| |
| |
| |
| |
| |
| expect(state.allVisualLines.length).toBe(4); |
| expect(state.allVisualLines[0]).toBe('This is a'); |
| expect(state.allVisualLines[1]).toBe('very long'); |
| expect(state.allVisualLines[2]).toBe('line of'); |
| expect(state.allVisualLines[3]).toBe('text.'); |
| }); |
|
|
| it('should update visualScrollRow when visualCursor moves out of viewport', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'l1\nl2\nl3\nl4\nl5', |
| viewport: { width: 5, height: 3 }, |
| }), |
| ); |
| |
| expect(getBufferState(result).visualScrollRow).toBe(0); |
| expect(getBufferState(result).allVisualLines).toEqual([ |
| 'l1', |
| 'l2', |
| 'l3', |
| 'l4', |
| 'l5', |
| ]); |
| expect(getBufferState(result).viewportVisualLines).toEqual([ |
| 'l1', |
| 'l2', |
| 'l3', |
| ]); |
|
|
| act(() => result.current.move('down')); |
| act(() => result.current.move('down')); |
| expect(getBufferState(result).visualScrollRow).toBe(0); |
|
|
| act(() => result.current.move('down')); |
| |
| let state = getBufferState(result); |
| expect(state.visualScrollRow).toBe(1); |
| expect(state.allVisualLines).toEqual(['l1', 'l2', 'l3', 'l4', 'l5']); |
| expect(state.viewportVisualLines).toEqual(['l2', 'l3', 'l4']); |
| expect(state.visualCursor).toEqual([3, 0]); |
|
|
| act(() => result.current.move('up')); |
| act(() => result.current.move('up')); |
| expect(getBufferState(result).visualScrollRow).toBe(1); |
|
|
| act(() => result.current.move('up')); |
| |
| state = getBufferState(result); |
| expect(state.visualScrollRow).toBe(0); |
| expect(state.allVisualLines).toEqual(['l1', 'l2', 'l3', 'l4', 'l5']); |
| expect(state.viewportVisualLines).toEqual(['l1', 'l2', 'l3']); |
| expect(state.visualCursor).toEqual([0, 0]); |
| }); |
| }); |
|
|
| describe('Undo/Redo', () => { |
| it('should undo and redo an insert operation', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => result.current.insert('a')); |
| expect(getBufferState(result).text).toBe('a'); |
|
|
| act(() => result.current.undo()); |
| expect(getBufferState(result).text).toBe(''); |
| expect(getBufferState(result).cursor).toEqual([0, 0]); |
|
|
| act(() => result.current.redo()); |
| expect(getBufferState(result).text).toBe('a'); |
| expect(getBufferState(result).cursor).toEqual([0, 1]); |
| }); |
|
|
| it('should undo and redo a newline operation', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'test', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => result.current.newline()); |
| expect(getBufferState(result).text).toBe('test\n'); |
|
|
| act(() => result.current.undo()); |
| expect(getBufferState(result).text).toBe('test'); |
| expect(getBufferState(result).cursor).toEqual([0, 4]); |
|
|
| act(() => result.current.redo()); |
| expect(getBufferState(result).text).toBe('test\n'); |
| expect(getBufferState(result).cursor).toEqual([1, 0]); |
| }); |
| }); |
|
|
| describe('Unicode Handling', () => { |
| it('insert: should correctly handle multi-byte unicode characters', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => result.current.insert('你好')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('你好'); |
| expect(state.cursor).toEqual([0, 2]); |
| expect(state.visualCursor).toEqual([0, 2]); |
| }); |
|
|
| it('backspace: should correctly delete multi-byte unicode characters', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '你好', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => result.current.backspace()); |
| let state = getBufferState(result); |
| expect(state.text).toBe('你'); |
| expect(state.cursor).toEqual([0, 1]); |
|
|
| act(() => result.current.backspace()); |
| state = getBufferState(result); |
| expect(state.text).toBe(''); |
| expect(state.cursor).toEqual([0, 0]); |
| }); |
|
|
| it('move: left/right should treat multi-byte chars as single units for visual cursor', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '🐶🐱', |
| viewport: { width: 5, height: 1 }, |
| }), |
| ); |
| |
| act(() => result.current.move('right')); |
| let state = getBufferState(result); |
| expect(state.cursor).toEqual([0, 1]); |
| expect(state.visualCursor).toEqual([0, 1]); |
|
|
| act(() => result.current.move('right')); |
| state = getBufferState(result); |
| expect(state.cursor).toEqual([0, 2]); |
| expect(state.visualCursor).toEqual([0, 2]); |
|
|
| act(() => result.current.move('left')); |
| state = getBufferState(result); |
| expect(state.cursor).toEqual([0, 1]); |
| expect(state.visualCursor).toEqual([0, 1]); |
| }); |
|
|
| it('move: up/down should work on wrapped lines (regression test)', async () => { |
| |
| |
| |
| |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport: { width: 10, height: 5 }, |
| }), |
| ); |
|
|
| act(() => { |
| result.current.setText('0123456789ABCDE'); |
| }); |
|
|
| |
| expect(getBufferState(result).cursor).toEqual([0, 15]); |
| expect(getBufferState(result).visualCursor).toEqual([1, 5]); |
|
|
| |
| |
| let handledUp = false; |
| act(() => { |
| handledUp = result.current.handleInput({ |
| name: 'up', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1b[A', |
| }); |
| }); |
| expect(handledUp).toBe(true); |
| expect(getBufferState(result).visualCursor[0]).toBe(0); |
|
|
| |
| |
| let handledDown = false; |
| act(() => { |
| handledDown = result.current.handleInput({ |
| name: 'down', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1b[B', |
| }); |
| }); |
| expect(handledDown).toBe(true); |
| expect(getBufferState(result).visualCursor[0]).toBe(1); |
| }); |
|
|
| it('moveToVisualPosition: should correctly handle wide characters (Chinese)', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '你好', |
| viewport: { width: 10, height: 1 }, |
| }), |
| ); |
|
|
| |
|
|
| |
| act(() => result.current.moveToVisualPosition(0, 0)); |
| expect(getBufferState(result).cursor).toEqual([0, 0]); |
|
|
| |
| act(() => result.current.moveToVisualPosition(0, 1)); |
| expect(getBufferState(result).cursor).toEqual([0, 1]); |
|
|
| |
| act(() => result.current.moveToVisualPosition(0, 2)); |
| expect(getBufferState(result).cursor).toEqual([0, 1]); |
|
|
| |
| act(() => result.current.moveToVisualPosition(0, 3)); |
| expect(getBufferState(result).cursor).toEqual([0, 2]); |
| }); |
| }); |
|
|
| describe('handleInput', () => { |
| it('should insert printable characters', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'h', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: 'h', |
| }); |
| }); |
| void act(() => |
| result.current.handleInput({ |
| name: 'i', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: 'i', |
| }), |
| ); |
| expect(getBufferState(result).text).toBe('hi'); |
| }); |
|
|
| it('should handle "Enter" key as newline', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'enter', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: '\r', |
| }); |
| }); |
| expect(getBufferState(result).lines).toEqual(['', '']); |
| }); |
|
|
| it('should handle Ctrl+J as newline', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'j', |
| shift: false, |
| alt: false, |
| ctrl: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\n', |
| }); |
| }); |
| expect(getBufferState(result).lines).toEqual(['', '']); |
| }); |
|
|
| it('should do nothing for a tab key press', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'tab', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\t', |
| }); |
| }); |
| expect(getBufferState(result).text).toBe(''); |
| }); |
|
|
| it('should do nothing for a shift tab key press', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'tab', |
| shift: true, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\u001b[9;2u', |
| }); |
| }); |
| expect(getBufferState(result).text).toBe(''); |
| }); |
|
|
| it('should handle CLEAR_INPUT (Ctrl+C)', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello', |
| viewport, |
| }), |
| ); |
| expect(getBufferState(result).text).toBe('hello'); |
| let handled = false; |
| act(() => { |
| handled = result.current.handleInput({ |
| name: 'c', |
| shift: false, |
| alt: false, |
| ctrl: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\u0003', |
| }); |
| }); |
| expect(handled).toBe(true); |
| expect(getBufferState(result).text).toBe(''); |
| }); |
|
|
| it('should NOT handle CLEAR_INPUT if buffer is empty', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| let handled = true; |
| act(() => { |
| handled = result.current.handleInput({ |
| name: 'c', |
| shift: false, |
| alt: false, |
| ctrl: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\u0003', |
| }); |
| }); |
| expect(handled).toBe(false); |
| }); |
|
|
| it('should handle "Backspace" key', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'a', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => { |
| result.current.handleInput({ |
| name: 'backspace', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x7f', |
| }); |
| }); |
| expect(getBufferState(result).text).toBe(''); |
| }); |
|
|
| it('should only handle Undo if there is something to undo', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
|
|
| |
| const undoKey: Key = |
| process.platform === 'win32' |
| ? { |
| name: 'z', |
| ctrl: true, |
| shift: false, |
| alt: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1a', |
| } |
| : process.platform === 'darwin' |
| ? { |
| name: 'z', |
| ctrl: false, |
| shift: false, |
| alt: false, |
| cmd: true, |
| insertable: false, |
| sequence: '\u001b[122;D', |
| } |
| : { |
| name: 'z', |
| ctrl: false, |
| shift: false, |
| alt: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\u001bz', |
| }; |
|
|
| |
| let handled = true; |
| act(() => { |
| handled = result.current.handleInput(undoKey); |
| }); |
| expect(handled).toBe(false); |
|
|
| |
| act(() => { |
| result.current.handleInput({ |
| name: 'a', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: 'a', |
| }); |
| }); |
| expect(getBufferState(result).text).toBe('a'); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(undoKey); |
| }); |
| expect(handled).toBe(true); |
| expect(getBufferState(result).text).toBe(''); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(undoKey); |
| }); |
| expect(handled).toBe(false); |
| }); |
|
|
| if (process.platform === 'linux') { |
| it('should handle "Ctrl+Z" for smart bubbling on Linux/WSL', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
|
|
| const ctrlZ: Key = { |
| name: 'z', |
| ctrl: true, |
| shift: false, |
| alt: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1a', |
| }; |
|
|
| |
| let handled = true; |
| act(() => { |
| handled = result.current.handleInput(ctrlZ); |
| }); |
| expect(handled).toBe(false); |
|
|
| |
| act(() => { |
| result.current.handleInput({ |
| name: 'x', |
| insertable: true, |
| sequence: 'x', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| }); |
| }); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(ctrlZ); |
| }); |
| expect(handled).toBe(true); |
| expect(getBufferState(result).text).toBe(''); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(ctrlZ); |
| }); |
| expect(handled).toBe(false); |
| }); |
| } |
|
|
| it('should only handle Redo if there is something to redo', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
|
|
| |
| const redoKey: Key = |
| process.platform === 'win32' |
| ? { |
| name: 'z', |
| ctrl: true, |
| shift: true, |
| alt: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1a', |
| } |
| : process.platform === 'darwin' |
| ? { |
| name: 'z', |
| ctrl: false, |
| shift: true, |
| alt: false, |
| cmd: true, |
| insertable: false, |
| sequence: '\u001b[122;2D', |
| } |
| : { |
| name: 'z', |
| ctrl: false, |
| shift: true, |
| alt: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\u001bZ', |
| }; |
|
|
| const undoKey: Key = |
| process.platform === 'win32' |
| ? { |
| name: 'z', |
| ctrl: true, |
| shift: false, |
| alt: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1a', |
| } |
| : process.platform === 'darwin' |
| ? { |
| name: 'z', |
| ctrl: false, |
| shift: false, |
| alt: false, |
| cmd: true, |
| insertable: false, |
| sequence: '\u001b[122;D', |
| } |
| : { |
| name: 'z', |
| ctrl: false, |
| shift: false, |
| alt: true, |
| cmd: false, |
| insertable: false, |
| sequence: '\u001bz', |
| }; |
|
|
| |
| let handled = true; |
| act(() => { |
| handled = result.current.handleInput(redoKey); |
| }); |
| expect(handled).toBe(false); |
|
|
| |
| act(() => { |
| result.current.handleInput({ |
| name: 'a', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: 'a', |
| }); |
| }); |
| act(() => { |
| result.current.handleInput(undoKey); |
| }); |
| expect(getBufferState(result).text).toBe(''); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(redoKey); |
| }); |
| expect(handled).toBe(true); |
| expect(getBufferState(result).text).toBe('a'); |
|
|
| |
| act(() => { |
| handled = result.current.handleInput(redoKey); |
| }); |
| expect(handled).toBe(false); |
| }); |
|
|
| it('should handle multiple delete characters in one input', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'abcde', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| expect(getBufferState(result).cursor).toEqual([0, 5]); |
|
|
| act(() => { |
| result.current.handleInput({ |
| name: 'backspace', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x7f', |
| }); |
| result.current.handleInput({ |
| name: 'backspace', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x7f', |
| }); |
| result.current.handleInput({ |
| name: 'backspace', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x7f', |
| }); |
| }); |
| expect(getBufferState(result).text).toBe('ab'); |
| expect(getBufferState(result).cursor).toEqual([0, 2]); |
| }); |
|
|
| it('should handle inserts that contain delete characters', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'abcde', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| expect(getBufferState(result).cursor).toEqual([0, 5]); |
|
|
| act(() => { |
| result.current.insert('\x7f\x7f\x7f'); |
| }); |
| expect(getBufferState(result).text).toBe('ab'); |
| expect(getBufferState(result).cursor).toEqual([0, 2]); |
| }); |
|
|
| it('should handle inserts with a mix of regular and delete characters', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'abcde', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| expect(getBufferState(result).cursor).toEqual([0, 5]); |
|
|
| act(() => { |
| result.current.insert('\x7fI\x7f\x7fNEW'); |
| }); |
| expect(getBufferState(result).text).toBe('abcNEW'); |
| expect(getBufferState(result).cursor).toEqual([0, 6]); |
| }); |
|
|
| it('should handle arrow keys for movement', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'ab', |
| viewport, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => { |
| result.current.handleInput({ |
| name: 'left', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1b[D', |
| }); |
| }); |
| expect(getBufferState(result).cursor).toEqual([0, 1]); |
| act(() => { |
| result.current.handleInput({ |
| name: 'right', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\x1b[C', |
| }); |
| }); |
| expect(getBufferState(result).cursor).toEqual([0, 2]); |
| }); |
|
|
| it('should strip ANSI escape codes when pasting text', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const textWithAnsi = '\x1B[31mHello\x1B[0m \x1B[32mWorld\x1B[0m'; |
| |
| act(() => { |
| result.current.handleInput({ |
| name: '', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: textWithAnsi, |
| }); |
| }); |
| expect(getBufferState(result).text).toBe('Hello World'); |
| }); |
|
|
| it('should handle VSCode terminal Shift+Enter as newline', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput({ |
| name: 'enter', |
| shift: true, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: '\r', |
| }); |
| }); |
| expect(getBufferState(result).lines).toEqual(['', '']); |
| }); |
|
|
| it('should correctly handle repeated pasting of long text', async () => { |
| const longText = `not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. |
| |
| Why do we use it? |
| It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). |
| |
| Where does it come from? |
| Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lore |
| `; |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
|
|
| |
| act(() => { |
| result.current.insert(longText, { paste: true }); |
| result.current.insert(longText, { paste: true }); |
| result.current.insert(longText, { paste: true }); |
| }); |
|
|
| const state = getBufferState(result); |
| |
| |
| expect(state.lines).toStrictEqual([ |
| '[Pasted Text: 8 lines][Pasted Text: 8 lines #2][Pasted Text: 8 lines #3]', |
| ]); |
| expect(result.current.pastedContent['[Pasted Text: 8 lines]']).toBe( |
| longText, |
| ); |
| expect(result.current.pastedContent['[Pasted Text: 8 lines #2]']).toBe( |
| longText, |
| ); |
| expect(result.current.pastedContent['[Pasted Text: 8 lines #3]']).toBe( |
| longText, |
| ); |
| const expectedCursorPos = offsetToLogicalPos( |
| state.text, |
| state.text.length, |
| ); |
| expect(state.cursor).toEqual(expectedCursorPos); |
| }); |
| }); |
|
|
| |
| |
| |
| |
| |
| |
| |
|
|
| describe('replaceRange', () => { |
| it('should replace a single-line range with single-line text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '@pac', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 1, 0, 4, 'packages')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('@packages'); |
| expect(state.cursor).toEqual([0, 9]); |
| }); |
|
|
| it('should replace a multi-line range with single-line text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello\nworld\nagain', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 2, 1, 3, ' new ')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('he new ld\nagain'); |
| expect(state.cursor).toEqual([0, 7]); |
| }); |
|
|
| it('should delete a range when replacing with an empty string', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello world', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 5, 0, 11, '')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello'); |
| expect(state.cursor).toEqual([0, 5]); |
| }); |
|
|
| it('should handle replacing at the beginning of the text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'world', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 0, 0, 0, 'hello ')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello world'); |
| expect(state.cursor).toEqual([0, 6]); |
| }); |
|
|
| it('should handle replacing at the end of the text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 5, 0, 5, ' world')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello world'); |
| expect(state.cursor).toEqual([0, 11]); |
| }); |
|
|
| it('should handle replacing the entire buffer content', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'old text', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 0, 0, 8, 'new text')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('new text'); |
| expect(state.cursor).toEqual([0, 8]); |
| }); |
|
|
| it('should correctly replace with unicode characters', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'hello *** world', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 6, 0, 9, '你好')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('hello 你好 world'); |
| expect(state.cursor).toEqual([0, 8]); |
| }); |
|
|
| it('should handle invalid range by returning false and not changing text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'test', |
| viewport, |
| }), |
| ); |
| act(() => { |
| result.current.replaceRange(0, 5, 0, 3, 'fail'); |
| }); |
|
|
| expect(getBufferState(result).text).toBe('test'); |
|
|
| act(() => { |
| result.current.replaceRange(1, 0, 0, 0, 'fail'); |
| }); |
| expect(getBufferState(result).text).toBe('test'); |
| }); |
|
|
| it('replaceRange: multiple lines with a single character', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'first\nsecond\nthird', |
| viewport, |
| }), |
| ); |
| act(() => result.current.replaceRange(0, 2, 2, 3, 'X')); |
| const state = getBufferState(result); |
| expect(state.text).toBe('fiXrd'); |
| expect(state.cursor).toEqual([0, 3]); |
| }); |
|
|
| it('should replace a single-line range with multi-line text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'one two three', |
| viewport, |
| }), |
| ); |
| |
| act(() => result.current.replaceRange(0, 4, 0, 7, 'new\nline')); |
| const state = getBufferState(result); |
| expect(state.lines).toEqual(['one new', 'line three']); |
| expect(state.text).toBe('one new\nline three'); |
| expect(state.cursor).toEqual([1, 4]); |
| }); |
| }); |
|
|
| describe('Input Sanitization', () => { |
| const createInput = (sequence: string) => ({ |
| name: '', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence, |
| }); |
| it.each([ |
| { |
| input: '\x1B[31mHello\x1B[0m \x1B[32mWorld\x1B[0m', |
| expected: 'Hello World', |
| desc: 'ANSI escape codes', |
| }, |
| { |
| input: 'H\x07e\x08l\x0Bl\x0Co', |
| expected: 'Hello', |
| desc: 'control characters', |
| }, |
| { |
| input: '\u001B[4mH\u001B[0mello', |
| expected: 'Hello', |
| desc: 'mixed ANSI and control characters', |
| }, |
| { |
| input: '\u001B[4mPasted\u001B[4m Text', |
| expected: 'Pasted Text', |
| desc: 'pasted text with ANSI', |
| }, |
| ])('should strip $desc from input', async ({ input, expected }) => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| act(() => { |
| result.current.handleInput(createInput(input)); |
| }); |
| expect(getBufferState(result).text).toBe(expected); |
| }); |
|
|
| it('should not strip standard characters or newlines', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const validText = 'Hello World\nThis is a test.'; |
| act(() => { |
| result.current.handleInput(createInput(validText)); |
| }); |
| expect(getBufferState(result).text).toBe(validText); |
| }); |
|
|
| it('should sanitize large text (>5000 chars) and strip unsafe characters', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const unsafeChars = '\x07\x08\x0B\x0C'; |
| const largeTextWithUnsafe = |
| 'safe text'.repeat(600) + unsafeChars + 'more safe text'; |
|
|
| expect(largeTextWithUnsafe.length).toBeGreaterThan(5000); |
|
|
| act(() => { |
| result.current.handleInput({ |
| name: '', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: largeTextWithUnsafe, |
| }); |
| }); |
|
|
| const resultText = getBufferState(result).text; |
| expect(resultText).not.toContain('\x07'); |
| expect(resultText).not.toContain('\x08'); |
| expect(resultText).not.toContain('\x0B'); |
| expect(resultText).not.toContain('\x0C'); |
| expect(resultText).toContain('safe text'); |
| expect(resultText).toContain('more safe text'); |
| }); |
|
|
| it('should sanitize large ANSI text (>5000 chars) and strip escape codes', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const largeTextWithAnsi = |
| '\x1B[31m' + |
| 'red text'.repeat(800) + |
| '\x1B[0m' + |
| '\x1B[32m' + |
| 'green text'.repeat(200) + |
| '\x1B[0m'; |
|
|
| expect(largeTextWithAnsi.length).toBeGreaterThan(5000); |
|
|
| act(() => { |
| result.current.handleInput({ |
| name: '', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: largeTextWithAnsi, |
| }); |
| }); |
|
|
| const resultText = getBufferState(result).text; |
| expect(resultText).not.toContain('\x1B[31m'); |
| expect(resultText).not.toContain('\x1B[32m'); |
| expect(resultText).not.toContain('\x1B[0m'); |
| expect(resultText).toContain('red text'); |
| expect(resultText).toContain('green text'); |
| }); |
|
|
| it('should not strip popular emojis', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
| const emojis = '🐍🐳🦀🦄'; |
| act(() => { |
| result.current.handleInput({ |
| name: '', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: emojis, |
| }); |
| }); |
| expect(getBufferState(result).text).toBe(emojis); |
| }); |
| }); |
|
|
| describe('inputFilter', () => { |
| it('should filter input based on the provided filter function', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| inputFilter: (text) => text.replace(/[^0-9]/g, ''), |
| }), |
| ); |
|
|
| act(() => result.current.insert('a1b2c3')); |
| expect(getBufferState(result).text).toBe('123'); |
| }); |
|
|
| it('should handle empty result from filter', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| inputFilter: (text) => text.replace(/[^0-9]/g, ''), |
| }), |
| ); |
|
|
| act(() => result.current.insert('abc')); |
| expect(getBufferState(result).text).toBe(''); |
| }); |
|
|
| it('should filter pasted text', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| inputFilter: (text) => text.toUpperCase(), |
| }), |
| ); |
|
|
| act(() => result.current.insert('hello', { paste: true })); |
| expect(getBufferState(result).text).toBe('HELLO'); |
| }); |
|
|
| it('should not filter newlines if they are allowed by the filter', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| inputFilter: (text) => text, |
| }), |
| ); |
|
|
| act(() => result.current.insert('a\nb')); |
| |
| |
| expect(getBufferState(result).text).toBe('a\nb'); |
| }); |
|
|
| it('should filter before newline check in insert', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| inputFilter: (text) => text.replace(/\n/g, ''), |
| }), |
| ); |
|
|
| act(() => result.current.insert('a\nb')); |
| expect(getBufferState(result).text).toBe('ab'); |
| }); |
| }); |
|
|
| describe('stripAnsi', () => { |
| it('should correctly strip ANSI escape codes', async () => { |
| const textWithAnsi = '\x1B[31mHello\x1B[0m World'; |
| expect(stripAnsi(textWithAnsi)).toBe('Hello World'); |
| }); |
|
|
| it('should handle multiple ANSI codes', async () => { |
| const textWithMultipleAnsi = '\x1B[1m\x1B[34mBold Blue\x1B[0m Text'; |
| expect(stripAnsi(textWithMultipleAnsi)).toBe('Bold Blue Text'); |
| }); |
|
|
| it('should not modify text without ANSI codes', async () => { |
| const plainText = 'Plain text'; |
| expect(stripAnsi(plainText)).toBe('Plain text'); |
| }); |
|
|
| it('should handle empty string', async () => { |
| expect(stripAnsi('')).toBe(''); |
| }); |
| }); |
|
|
| describe('Memoization', () => { |
| it('should keep action references stable across re-renders', async () => { |
| const { result, rerender } = await renderHook(() => |
| useTextBuffer({ viewport }), |
| ); |
|
|
| const initialInsert = result.current.insert; |
| const initialBackspace = result.current.backspace; |
| const initialMove = result.current.move; |
| const initialHandleInput = result.current.handleInput; |
|
|
| rerender(); |
|
|
| expect(result.current.insert).toBe(initialInsert); |
| expect(result.current.backspace).toBe(initialBackspace); |
| expect(result.current.move).toBe(initialMove); |
| expect(result.current.handleInput).toBe(initialHandleInput); |
| }); |
|
|
| it('should have memoized actions that operate on the latest state', async () => { |
| const { result } = await renderHook(() => useTextBuffer({ viewport })); |
|
|
| |
| const memoizedInsert = result.current.insert; |
|
|
| |
| act(() => { |
| result.current.insert('hello'); |
| }); |
| expect(getBufferState(result).text).toBe('hello'); |
|
|
| |
| act(() => { |
| memoizedInsert(' world'); |
| }); |
|
|
| |
| expect(getBufferState(result).text).toBe('hello world'); |
| }); |
| }); |
|
|
| describe('singleLine mode', () => { |
| it('should not insert a newline character when singleLine is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| singleLine: true, |
| }), |
| ); |
| act(() => result.current.insert('\n')); |
| const state = getBufferState(result); |
| expect(state.text).toBe(''); |
| expect(state.lines).toEqual(['']); |
| }); |
|
|
| it('should not create a new line when newline() is called and singleLine is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'ab', |
| viewport, |
|
|
| singleLine: true, |
| }), |
| ); |
| act(() => result.current.move('end')); |
| act(() => result.current.newline()); |
| const state = getBufferState(result); |
| expect(state.text).toBe('ab'); |
| expect(state.lines).toEqual(['ab']); |
| expect(state.cursor).toEqual([0, 2]); |
| }); |
|
|
| it('should not handle "Enter" key as newline when singleLine is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| singleLine: true, |
| }), |
| ); |
| act(() => { |
| result.current.handleInput({ |
| name: 'enter', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: true, |
| sequence: '\r', |
| }); |
| }); |
| expect(getBufferState(result).lines).toEqual(['']); |
| }); |
|
|
| it('should not print anything for function keys when singleLine is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| singleLine: true, |
| }), |
| ); |
| act(() => { |
| result.current.handleInput({ |
| name: 'f1', |
| shift: false, |
| alt: false, |
| ctrl: false, |
| cmd: false, |
| insertable: false, |
| sequence: '\u001bOP', |
| }); |
| }); |
| expect(getBufferState(result).lines).toEqual(['']); |
| }); |
|
|
| it('should strip newlines from pasted text when singleLine is true', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| viewport, |
|
|
| singleLine: true, |
| }), |
| ); |
| act(() => result.current.insert('hello\nworld', { paste: true })); |
| const state = getBufferState(result); |
| expect(state.text).toBe('helloworld'); |
| expect(state.lines).toEqual(['helloworld']); |
| }); |
| }); |
| }); |
|
|
| describe('offsetToLogicalPos', () => { |
| it.each([ |
| { text: 'any text', offset: 0, expected: [0, 0], desc: 'offset 0' }, |
| { text: 'hello', offset: 0, expected: [0, 0], desc: 'single line start' }, |
| { text: 'hello', offset: 2, expected: [0, 2], desc: 'single line middle' }, |
| { text: 'hello', offset: 5, expected: [0, 5], desc: 'single line end' }, |
| { text: 'hello', offset: 10, expected: [0, 5], desc: 'beyond end clamps' }, |
| { |
| text: 'a\n\nc', |
| offset: 0, |
| expected: [0, 0], |
| desc: 'empty lines - first char', |
| }, |
| { |
| text: 'a\n\nc', |
| offset: 1, |
| expected: [0, 1], |
| desc: 'empty lines - end of first', |
| }, |
| { |
| text: 'a\n\nc', |
| offset: 2, |
| expected: [1, 0], |
| desc: 'empty lines - empty line', |
| }, |
| { |
| text: 'a\n\nc', |
| offset: 3, |
| expected: [2, 0], |
| desc: 'empty lines - last line start', |
| }, |
| { |
| text: 'a\n\nc', |
| offset: 4, |
| expected: [2, 1], |
| desc: 'empty lines - last line end', |
| }, |
| { |
| text: 'hello\n', |
| offset: 5, |
| expected: [0, 5], |
| desc: 'newline end - before newline', |
| }, |
| { |
| text: 'hello\n', |
| offset: 6, |
| expected: [1, 0], |
| desc: 'newline end - after newline', |
| }, |
| { |
| text: 'hello\n', |
| offset: 7, |
| expected: [1, 0], |
| desc: 'newline end - beyond', |
| }, |
| { |
| text: '\nhello', |
| offset: 0, |
| expected: [0, 0], |
| desc: 'newline start - first line', |
| }, |
| { |
| text: '\nhello', |
| offset: 1, |
| expected: [1, 0], |
| desc: 'newline start - second line', |
| }, |
| { |
| text: '\nhello', |
| offset: 3, |
| expected: [1, 2], |
| desc: 'newline start - middle of second', |
| }, |
| { text: '', offset: 0, expected: [0, 0], desc: 'empty string at 0' }, |
| { text: '', offset: 5, expected: [0, 0], desc: 'empty string beyond' }, |
| { |
| text: '你好\n世界', |
| offset: 0, |
| expected: [0, 0], |
| desc: 'unicode - start', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 1, |
| expected: [0, 1], |
| desc: 'unicode - after first char', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 2, |
| expected: [0, 2], |
| desc: 'unicode - end first line', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 3, |
| expected: [1, 0], |
| desc: 'unicode - second line start', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 4, |
| expected: [1, 1], |
| desc: 'unicode - second line middle', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 5, |
| expected: [1, 2], |
| desc: 'unicode - second line end', |
| }, |
| { |
| text: '你好\n世界', |
| offset: 6, |
| expected: [1, 2], |
| desc: 'unicode - beyond', |
| }, |
| { |
| text: 'abc\ndef', |
| offset: 3, |
| expected: [0, 3], |
| desc: 'at newline - end of line', |
| }, |
| { |
| text: 'abc\ndef', |
| offset: 4, |
| expected: [1, 0], |
| desc: 'at newline - after newline', |
| }, |
| { text: '🐶🐱', offset: 0, expected: [0, 0], desc: 'emoji - start' }, |
| { text: '🐶🐱', offset: 1, expected: [0, 1], desc: 'emoji - middle' }, |
| { text: '🐶🐱', offset: 2, expected: [0, 2], desc: 'emoji - end' }, |
| ])('should handle $desc', async ({ text, offset, expected }) => { |
| expect(offsetToLogicalPos(text, offset)).toEqual(expected); |
| }); |
|
|
| describe('multi-line text', () => { |
| const text = 'hello\nworld\n123'; |
|
|
| it.each([ |
| { offset: 0, expected: [0, 0], desc: 'start of first line' }, |
| { offset: 3, expected: [0, 3], desc: 'middle of first line' }, |
| { offset: 5, expected: [0, 5], desc: 'end of first line' }, |
| { offset: 6, expected: [1, 0], desc: 'start of second line' }, |
| { offset: 8, expected: [1, 2], desc: 'middle of second line' }, |
| { offset: 11, expected: [1, 5], desc: 'end of second line' }, |
| { offset: 12, expected: [2, 0], desc: 'start of third line' }, |
| { offset: 13, expected: [2, 1], desc: 'middle of third line' }, |
| { offset: 15, expected: [2, 3], desc: 'end of third line' }, |
| { offset: 20, expected: [2, 3], desc: 'beyond end' }, |
| ])( |
| 'should return $expected for $desc (offset $offset)', |
| ({ offset, expected }) => { |
| expect(offsetToLogicalPos(text, offset)).toEqual(expected); |
| }, |
| ); |
| }); |
| }); |
|
|
| describe('logicalPosToOffset', () => { |
| it('should convert row/col position to offset correctly', async () => { |
| const lines = ['hello', 'world', '123']; |
|
|
| |
| expect(logicalPosToOffset(lines, 0, 0)).toBe(0); |
| expect(logicalPosToOffset(lines, 0, 3)).toBe(3); |
| expect(logicalPosToOffset(lines, 0, 5)).toBe(5); |
|
|
| |
| expect(logicalPosToOffset(lines, 1, 0)).toBe(6); |
| expect(logicalPosToOffset(lines, 1, 2)).toBe(8); |
| expect(logicalPosToOffset(lines, 1, 5)).toBe(11); |
|
|
| |
| expect(logicalPosToOffset(lines, 2, 0)).toBe(12); |
| expect(logicalPosToOffset(lines, 2, 1)).toBe(13); |
| expect(logicalPosToOffset(lines, 2, 3)).toBe(15); |
| }); |
|
|
| it('should handle empty lines', async () => { |
| const lines = ['a', '', 'c']; |
|
|
| expect(logicalPosToOffset(lines, 0, 0)).toBe(0); |
| expect(logicalPosToOffset(lines, 0, 1)).toBe(1); |
| expect(logicalPosToOffset(lines, 1, 0)).toBe(2); |
| expect(logicalPosToOffset(lines, 2, 0)).toBe(3); |
| expect(logicalPosToOffset(lines, 2, 1)).toBe(4); |
| }); |
|
|
| it('should handle single empty line', async () => { |
| const lines = ['']; |
|
|
| expect(logicalPosToOffset(lines, 0, 0)).toBe(0); |
| }); |
|
|
| it('should be inverse of offsetToLogicalPos', async () => { |
| const lines = ['hello', 'world', '123']; |
| const text = lines.join('\n'); |
|
|
| |
| for (let offset = 0; offset <= text.length; offset++) { |
| const [row, col] = offsetToLogicalPos(text, offset); |
| const convertedOffset = logicalPosToOffset(lines, row, col); |
| expect(convertedOffset).toBe(offset); |
| } |
| }); |
|
|
| it('should handle out-of-bounds positions', async () => { |
| const lines = ['hello']; |
|
|
| |
| expect(logicalPosToOffset(lines, 0, 10)).toBe(5); |
|
|
| |
| expect(logicalPosToOffset(lines, 5, 0)).toBe(0); |
| expect(logicalPosToOffset(lines, 5, 10)).toBe(5); |
| }); |
| }); |
|
|
| const createTestState = ( |
| lines: string[], |
| cursorRow: number, |
| cursorCol: number, |
| viewportWidth = 80, |
| ): TextBufferState => { |
| const text = lines.join('\n'); |
| let state = textBufferReducer(initialState, { |
| type: 'set_text', |
| payload: text, |
| }); |
| state = textBufferReducer(state, { |
| type: 'set_cursor', |
| payload: { cursorRow, cursorCol, preferredCol: null }, |
| }); |
| state = textBufferReducer(state, { |
| type: 'set_viewport', |
| payload: { width: viewportWidth, height: 24 }, |
| }); |
| return state; |
| }; |
|
|
| describe('textBufferReducer vim operations', () => { |
| describe('vim_delete_line', () => { |
| it('should delete a single line including newline in multi-line text', async () => { |
| const state = createTestState(['line1', 'line2', 'line3'], 1, 2); |
|
|
| const action: TextBufferAction = { |
| type: 'vim_delete_line', |
| payload: { count: 1 }, |
| }; |
|
|
| const result = textBufferReducer(state, action); |
| expect(result).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(result.lines).toEqual(['line1', 'line3']); |
| expect(result.cursorRow).toBe(1); |
| expect(result.cursorCol).toBe(0); |
| }); |
|
|
| it('should delete multiple lines when count > 1', async () => { |
| const state = createTestState(['line1', 'line2', 'line3', 'line4'], 1, 0); |
|
|
| const action: TextBufferAction = { |
| type: 'vim_delete_line', |
| payload: { count: 2 }, |
| }; |
|
|
| const result = textBufferReducer(state, action); |
| expect(result).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(result.lines).toEqual(['line1', 'line4']); |
| expect(result.cursorRow).toBe(1); |
| expect(result.cursorCol).toBe(0); |
| }); |
|
|
| it('should clear single line content when only one line exists', async () => { |
| const state = createTestState(['only line'], 0, 5); |
|
|
| const action: TextBufferAction = { |
| type: 'vim_delete_line', |
| payload: { count: 1 }, |
| }; |
|
|
| const result = textBufferReducer(state, action); |
| expect(result).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(result.lines).toEqual(['']); |
| expect(result.cursorRow).toBe(0); |
| expect(result.cursorCol).toBe(0); |
| }); |
|
|
| it('should handle deleting the last line properly', async () => { |
| const state = createTestState(['line1', 'line2'], 1, 0); |
|
|
| const action: TextBufferAction = { |
| type: 'vim_delete_line', |
| payload: { count: 1 }, |
| }; |
|
|
| const result = textBufferReducer(state, action); |
| expect(result).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(result.lines).toEqual(['line1']); |
| expect(result.cursorRow).toBe(0); |
| expect(result.cursorCol).toBe(0); |
| }); |
|
|
| it('should handle deleting all lines and maintain valid state for subsequent paste', async () => { |
| const state = createTestState(['line1', 'line2', 'line3', 'line4'], 0, 0); |
|
|
| |
| const deleteAction: TextBufferAction = { |
| type: 'vim_delete_line', |
| payload: { count: 4 }, |
| }; |
|
|
| const afterDelete = textBufferReducer(state, deleteAction); |
| expect(afterDelete).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(afterDelete.lines).toEqual(['']); |
| expect(afterDelete.cursorRow).toBe(0); |
| expect(afterDelete.cursorCol).toBe(0); |
|
|
| |
| const pasteAction: TextBufferAction = { |
| type: 'insert', |
| payload: 'new1\nnew2\nnew3\nnew4', |
| }; |
|
|
| const afterPaste = textBufferReducer(afterDelete, pasteAction); |
| expect(afterPaste).toHaveOnlyValidCharacters(); |
|
|
| |
| expect(afterPaste.lines).toEqual(['new1', 'new2', 'new3', 'new4']); |
| expect(afterPaste.cursorRow).toBe(3); |
| expect(afterPaste.cursorCol).toBe(4); |
| }); |
| }); |
| }); |
|
|
| describe('Unicode helper functions', () => { |
| describe('findWordEndInLine with Unicode', () => { |
| it('should handle combining characters', async () => { |
| |
| const cafeWithCombining = 'cafe\u0301'; |
| const result = findWordEndInLine(cafeWithCombining + ' test', 0); |
| expect(result).toBe(3); |
| }); |
|
|
| it('should handle precomposed characters with diacritics', async () => { |
| |
| const cafePrecomposed = 'café'; |
| const result = findWordEndInLine(cafePrecomposed + ' test', 0); |
| expect(result).toBe(3); |
| }); |
|
|
| it('should return null when no word end found', async () => { |
| const result = findWordEndInLine(' ', 0); |
| expect(result).toBeNull(); |
| }); |
| }); |
|
|
| describe('findNextWordStartInLine with Unicode', () => { |
| it('should handle right-to-left text', async () => { |
| const result = findNextWordStartInLine('hello مرحبا world', 0); |
| expect(result).toBe(6); |
| }); |
|
|
| it('should handle Chinese characters', async () => { |
| const result = findNextWordStartInLine('hello 你好 world', 0); |
| expect(result).toBe(6); |
| }); |
|
|
| it('should return null at end of line', async () => { |
| const result = findNextWordStartInLine('hello', 10); |
| expect(result).toBeNull(); |
| }); |
|
|
| it('should handle combining characters', async () => { |
| |
| const textWithCombining = 'cafe\u0301 test'; |
| const result = findNextWordStartInLine(textWithCombining, 0); |
| expect(result).toBe(6); |
| }); |
|
|
| it('should handle precomposed characters with diacritics', async () => { |
| |
| const textPrecomposed = 'café test'; |
| const result = findNextWordStartInLine(textPrecomposed, 0); |
| expect(result).toBe(5); |
| }); |
| }); |
|
|
| describe('isWordCharStrict with Unicode', () => { |
| it('should return true for ASCII word characters', async () => { |
| expect(isWordCharStrict('a')).toBe(true); |
| expect(isWordCharStrict('Z')).toBe(true); |
| expect(isWordCharStrict('0')).toBe(true); |
| expect(isWordCharStrict('_')).toBe(true); |
| }); |
|
|
| it('should return false for punctuation', async () => { |
| expect(isWordCharStrict('.')).toBe(false); |
| expect(isWordCharStrict(',')).toBe(false); |
| expect(isWordCharStrict('!')).toBe(false); |
| }); |
|
|
| it('should return true for non-Latin scripts', async () => { |
| expect(isWordCharStrict('你')).toBe(true); |
| expect(isWordCharStrict('م')).toBe(true); |
| }); |
|
|
| it('should return false for whitespace', async () => { |
| expect(isWordCharStrict(' ')).toBe(false); |
| expect(isWordCharStrict('\t')).toBe(false); |
| }); |
| }); |
|
|
| describe('cpLen with Unicode', () => { |
| it('should handle combining characters', async () => { |
| expect(cpLen('é')).toBe(1); |
| expect(cpLen('e\u0301')).toBe(2); |
| }); |
|
|
| it('should handle Chinese and Arabic text', async () => { |
| expect(cpLen('hello 你好 world')).toBe(14); |
| expect(cpLen('hello مرحبا world')).toBe(17); |
| }); |
| }); |
|
|
| describe('useTextBuffer CJK Navigation', () => { |
| const viewport = { width: 80, height: 24 }; |
|
|
| it('should navigate by word in Chinese', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: '你好世界', |
| initialCursorOffset: 4, |
| viewport, |
| }), |
| ); |
|
|
| |
| |
|
|
| |
| act(() => { |
| result.current.move('wordLeft'); |
| }); |
|
|
| |
| |
| expect(result.current.cursor[1]).toBe(2); |
|
|
| |
| act(() => { |
| result.current.move('wordLeft'); |
| }); |
|
|
| |
| expect(result.current.cursor[1]).toBe(0); |
|
|
| |
| act(() => { |
| result.current.move('wordLeft'); |
| }); |
| expect(result.current.cursor[1]).toBe(0); |
|
|
| |
| act(() => { |
| result.current.move('wordRight'); |
| }); |
|
|
| |
| expect(result.current.cursor[1]).toBe(2); |
|
|
| |
| act(() => { |
| result.current.move('wordRight'); |
| }); |
|
|
| |
| expect(result.current.cursor[1]).toBe(4); |
|
|
| |
| act(() => { |
| result.current.move('wordRight'); |
| }); |
| expect(result.current.cursor[1]).toBe(4); |
| }); |
|
|
| it('should navigate mixed English and Chinese', async () => { |
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: 'Hello你好World', |
| initialCursorOffset: 10, |
| viewport, |
| }), |
| ); |
|
|
| |
| |
| |
|
|
| act(() => { |
| result.current.move('end'); |
| }); |
| expect(result.current.cursor[1]).toBe(12); |
|
|
| |
| act(() => result.current.move('wordLeft')); |
| expect(result.current.cursor[1]).toBe(7); |
|
|
| |
| act(() => result.current.move('wordLeft')); |
| expect(result.current.cursor[1]).toBe(5); |
|
|
| |
| act(() => result.current.move('wordLeft')); |
| expect(result.current.cursor[1]).toBe(0); |
|
|
| |
| act(() => result.current.move('wordLeft')); |
| expect(result.current.cursor[1]).toBe(0); |
| }); |
| }); |
| }); |
|
|
| const mockPlatform = (platform: string) => { |
| vi.stubGlobal( |
| 'process', |
| Object.create(process, { |
| platform: { |
| get: () => platform, |
| }, |
| }), |
| ); |
| }; |
|
|
| describe('Transformation Utilities', () => { |
| afterEach(() => { |
| vi.restoreAllMocks(); |
| vi.unstubAllGlobals(); |
| }); |
|
|
| describe('getTransformedImagePath', () => { |
| beforeEach(() => mockPlatform('linux')); |
|
|
| it('should transform a simple image path', async () => { |
| expect(getTransformedImagePath('@test.png')).toBe('[Image test.png]'); |
| }); |
|
|
| it('should handle paths with directories', async () => { |
| expect(getTransformedImagePath('@path/to/image.jpg')).toBe( |
| '[Image image.jpg]', |
| ); |
| }); |
|
|
| it('should truncate long filenames', async () => { |
| expect(getTransformedImagePath('@verylongfilename1234567890.png')).toBe( |
| '[Image ...1234567890.png]', |
| ); |
| }); |
|
|
| it('should handle different image extensions', async () => { |
| expect(getTransformedImagePath('@test.jpg')).toBe('[Image test.jpg]'); |
| expect(getTransformedImagePath('@test.jpeg')).toBe('[Image test.jpeg]'); |
| expect(getTransformedImagePath('@test.gif')).toBe('[Image test.gif]'); |
| expect(getTransformedImagePath('@test.webp')).toBe('[Image test.webp]'); |
| expect(getTransformedImagePath('@test.svg')).toBe('[Image test.svg]'); |
| expect(getTransformedImagePath('@test.bmp')).toBe('[Image test.bmp]'); |
| }); |
|
|
| it('should handle POSIX-style forward-slash paths on any platform', async () => { |
| const input = '@C:/Users/foo/screenshots/image2x.png'; |
| expect(getTransformedImagePath(input)).toBe('[Image image2x.png]'); |
| }); |
|
|
| it('should handle escaped spaces in paths', async () => { |
| const input = '@path/to/my\\ file.png'; |
| expect(getTransformedImagePath(input)).toBe('[Image my file.png]'); |
| }); |
| }); |
|
|
| describe('getTransformationsForLine', () => { |
| it('should find transformations in a line', async () => { |
| const line = 'Check out @test.png and @another.jpg'; |
| const result = calculateTransformationsForLine(line); |
|
|
| expect(result).toHaveLength(2); |
| expect(result[0]).toMatchObject({ |
| logicalText: '@test.png', |
| collapsedText: '[Image test.png]', |
| }); |
| expect(result[1]).toMatchObject({ |
| logicalText: '@another.jpg', |
| collapsedText: '[Image another.jpg]', |
| }); |
| }); |
|
|
| it('should handle no transformations', async () => { |
| const line = 'Just some regular text'; |
| const result = calculateTransformationsForLine(line); |
| expect(result).toEqual([]); |
| }); |
|
|
| it('should handle empty line', async () => { |
| const result = calculateTransformationsForLine(''); |
| expect(result).toEqual([]); |
| }); |
|
|
| it('should keep adjacent image paths as separate transformations', async () => { |
| const line = '@a.png@b.png@c.png'; |
| const result = calculateTransformationsForLine(line); |
| expect(result).toHaveLength(3); |
| expect(result[0].logicalText).toBe('@a.png'); |
| expect(result[1].logicalText).toBe('@b.png'); |
| expect(result[2].logicalText).toBe('@c.png'); |
| }); |
|
|
| it('should handle multiple transformations in a row', async () => { |
| const line = '@a.png @b.png @c.png'; |
| const result = calculateTransformationsForLine(line); |
| expect(result).toHaveLength(3); |
| }); |
| }); |
|
|
| describe('getTransformUnderCursor', () => { |
| const transformations: Transformation[] = [ |
| { |
| logStart: 5, |
| logEnd: 14, |
| logicalText: '@test.png', |
| collapsedText: '[Image @test.png]', |
| type: 'image', |
| }, |
| { |
| logStart: 20, |
| logEnd: 31, |
| logicalText: '@another.jpg', |
| collapsedText: '[Image @another.jpg]', |
| type: 'image', |
| }, |
| ]; |
|
|
| it('should find transformation when cursor is inside it', async () => { |
| const result = getTransformUnderCursor(0, 7, [transformations]); |
| expect(result).toEqual(transformations[0]); |
| }); |
|
|
| it('should find transformation when cursor is at start', async () => { |
| const result = getTransformUnderCursor(0, 5, [transformations]); |
| expect(result).toEqual(transformations[0]); |
| }); |
|
|
| it('should NOT find transformation when cursor is at end', async () => { |
| const result = getTransformUnderCursor(0, 14, [transformations]); |
| expect(result).toBeNull(); |
| }); |
|
|
| it('should return null when cursor is not on a transformation', async () => { |
| const result = getTransformUnderCursor(0, 2, [transformations]); |
| expect(result).toBeNull(); |
| }); |
|
|
| it('should handle empty transformations array', async () => { |
| const result = getTransformUnderCursor(0, 5, []); |
| expect(result).toBeNull(); |
| }); |
|
|
| it('regression: should not find paste transformation when clicking one character after it', async () => { |
| const pasteId = '[Pasted Text: 5 lines]'; |
| const line = pasteId + ' suffix'; |
| const transformations = calculateTransformationsForLine(line); |
| const pasteTransform = transformations.find((t) => t.type === 'paste'); |
| expect(pasteTransform).toBeDefined(); |
|
|
| const endPos = pasteTransform!.logEnd; |
| |
| expect(getTransformUnderCursor(0, endPos, [transformations])).toBeNull(); |
| |
| expect(getTransformUnderCursor(0, endPos - 1, [transformations])).toEqual( |
| pasteTransform, |
| ); |
| }); |
| }); |
|
|
| describe('calculateTransformedLine', () => { |
| it('should transform a line with one transformation', async () => { |
| const line = 'Check out @test.png'; |
| const transformations = calculateTransformationsForLine(line); |
| const result = calculateTransformedLine(line, 0, [0, 0], transformations); |
|
|
| expect(result.transformedLine).toBe('Check out [Image test.png]'); |
| expect(result.transformedToLogMap).toHaveLength(27); |
|
|
| |
| expect(result.transformedToLogMap[0]).toBe(0); |
| expect(result.transformedToLogMap[9]).toBe(9); |
| }); |
|
|
| it('should handle cursor inside transformation', async () => { |
| const line = 'Check out @test.png'; |
| const transformations = calculateTransformationsForLine(line); |
| |
| const result = calculateTransformedLine( |
| line, |
| 0, |
| [0, 10], |
| transformations, |
| ); |
|
|
| |
| expect(result.transformedLine).toBe('Check out @test.png'); |
| |
| expect(result.transformedToLogMap[10]).toBe(10); |
| }); |
|
|
| it('should handle line with no transformations', async () => { |
| const line = 'Just some text'; |
| const result = calculateTransformedLine(line, 0, [0, 0], []); |
|
|
| expect(result.transformedLine).toBe(line); |
| |
| expect(result.transformedToLogMap).toHaveLength(15); |
| expect(result.transformedToLogMap[0]).toBe(0); |
| expect(result.transformedToLogMap[13]).toBe(13); |
| expect(result.transformedToLogMap[14]).toBe(14); |
| }); |
|
|
| it('should handle empty line', async () => { |
| const result = calculateTransformedLine('', 0, [0, 0], []); |
| expect(result.transformedLine).toBe(''); |
| expect(result.transformedToLogMap).toEqual([0]); |
| }); |
| }); |
|
|
| describe('Layout Caching and Invalidation', () => { |
| it.each([ |
| { |
| desc: 'via setText', |
| actFn: (result: { current: TextBuffer }) => |
| result.current.setText('changed line'), |
| expected: 'changed line', |
| }, |
| { |
| desc: 'via replaceRange', |
| actFn: (result: { current: TextBuffer }) => |
| result.current.replaceRange(0, 0, 0, 13, 'changed line'), |
| expected: 'changed line', |
| }, |
| ])( |
| 'should invalidate cache when line content changes $desc', |
| async ({ actFn, expected }) => { |
| const viewport = { width: 80, height: 24 }; |
| const { result } = await renderHookWithProviders(() => |
| useTextBuffer({ |
| initialText: 'original line', |
| viewport, |
| escapePastedPaths: true, |
| }), |
| ); |
|
|
| const originalLayout = result.current.visualLayout; |
|
|
| act(() => { |
| actFn(result); |
| }); |
|
|
| expect(result.current.visualLayout).not.toBe(originalLayout); |
| expect(result.current.allVisualLines[0]).toBe(expected); |
| }, |
| ); |
|
|
| it('should invalidate cache when viewport width changes', async () => { |
| const viewport = { width: 80, height: 24 }; |
| const { result, rerender } = await renderHookWithProviders( |
| ({ vp }) => |
| useTextBuffer({ |
| initialText: |
| 'a very long line that will wrap when the viewport is small', |
| viewport: vp, |
| escapePastedPaths: true, |
| }), |
| { initialProps: { vp: viewport } }, |
| ); |
|
|
| const originalLayout = result.current.visualLayout; |
|
|
| |
| rerender({ vp: { width: 10, height: 24 } }); |
|
|
| expect(result.current.visualLayout).not.toBe(originalLayout); |
| expect(result.current.allVisualLines.length).toBeGreaterThan(1); |
| }); |
|
|
| it('should correctly handle cursor expansion/collapse in cached layout', async () => { |
| const viewport = { width: 80, height: 24 }; |
| const text = 'Check @image.png here'; |
| const { result } = await renderHookWithProviders(() => |
| useTextBuffer({ |
| initialText: text, |
| viewport, |
| escapePastedPaths: true, |
| }), |
| ); |
|
|
| |
| act(() => { |
| result.current.moveToOffset(0); |
| }); |
| expect(result.current.allVisualLines[0]).toContain('[Image image.png]'); |
|
|
| |
| act(() => { |
| result.current.moveToOffset(7); |
| }); |
| expect(result.current.allVisualLines[0]).toContain('@image.png'); |
| expect(result.current.allVisualLines[0]).not.toContain( |
| '[Image image.png]', |
| ); |
|
|
| |
| act(() => { |
| result.current.moveToOffset(0); |
| }); |
| expect(result.current.allVisualLines[0]).toContain('[Image image.png]'); |
| }); |
|
|
| it('should reuse cache for unchanged lines during editing', async () => { |
| const viewport = { width: 80, height: 24 }; |
| const initialText = 'line 1\nline 2\nline 3'; |
| const { result } = await renderHookWithProviders(() => |
| useTextBuffer({ |
| initialText, |
| viewport, |
| escapePastedPaths: true, |
| }), |
| ); |
|
|
| const layout1 = result.current.visualLayout; |
|
|
| |
| act(() => { |
| result.current.moveToOffset(0); |
| result.current.insert('X'); |
| }); |
|
|
| const layout2 = result.current.visualLayout; |
| expect(layout2).not.toBe(layout1); |
|
|
| |
| |
| expect(result.current.allVisualLines[1]).toBe('line 2'); |
| expect(result.current.allVisualLines[2]).toBe('line 3'); |
| }); |
| }); |
|
|
| describe('Scroll Regressions', () => { |
| const scrollViewport: Viewport = { width: 80, height: 5 }; |
|
|
| it('should not show empty viewport when collapsing a large paste that was scrolled', async () => { |
| const largeContent = |
| 'line1\nline2\nline3\nline4\nline5\nline6\nline7\nline8\nline9\nline10'; |
| const placeholder = '[Pasted Text: 10 lines]'; |
|
|
| const { result } = await renderHook(() => |
| useTextBuffer({ |
| initialText: placeholder, |
| viewport: scrollViewport, |
| }), |
| ); |
|
|
| |
| act(() => { |
| result.current.setText(''); |
| result.current.insert(largeContent, { paste: true }); |
| }); |
|
|
| |
| act(() => { |
| result.current.togglePasteExpansion(placeholder, 0, 0); |
| }); |
|
|
| |
| expect(result.current.visualScrollRow).toBe(5); |
|
|
| |
| act(() => { |
| result.current.togglePasteExpansion(placeholder, 9, 0); |
| }); |
|
|
| |
| expect(result.current.allVisualLines.length).toBe(1); |
| expect(result.current.viewportVisualLines.length).toBe(1); |
| expect(result.current.viewportVisualLines[0]).toBe(placeholder); |
| }); |
| }); |
| }); |
|
|