[mirror_xterm.js.git] / src / CompositionHelper.test.ts

import { assert } from 'chai';
import { CompositionHelper } from './CompositionHelper';

describe('CompositionHelper', () => {
  let terminal;
  let compositionHelper;
  let compositionView;
  let textarea;
  let handledText;

  beforeEach(() => {
    compositionView = {
      classList: {
        add: () => {},
        remove: () => {},
      },
      getBoundingClientRect: () => {
        return { width: 0 };
      },
      style: {
        left: 0,
        top: 0
      },
      textContent: ''
    };
    textarea = {
      value: '',
      style: {
        left: 0,
        top: 0
      }
    };
    terminal = {
      element: {
        querySelector: () => {
          return { offsetLeft: 0, offsetTop: 0 };
        }
      },
      handler: function (text) {
        handledText += text;
      }
    };
    handledText = '';
    compositionHelper = new CompositionHelper(textarea, compositionView, terminal);
  });

  describe('Input', () => {
    it('Should insert simple characters', function (done) {
      // First character 'ㅇ'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'ㅇ' });
      textarea.value = 'ㅇ';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionend();
        setTimeout(() => { // wait for any textarea updates
          assert.equal(handledText, 'ㅇ');
          // Second character 'ㅇ'
          compositionHelper.compositionstart();
          compositionHelper.compositionupdate({ data: 'ㅇ' });
          textarea.value = 'ㅇㅇ';
          setTimeout(() => { // wait for any textarea updates
            compositionHelper.compositionend();
            setTimeout(() => { // wait for any textarea updates
              assert.equal(handledText, 'ㅇㅇ');
              done();
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert complex characters', function (done) {
      // First character '앙'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'ㅇ' });
      textarea.value = 'ㅇ';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionupdate({ data: '아' });
        textarea.value = '아';
        setTimeout(() => { // wait for any textarea updates
          compositionHelper.compositionupdate({ data: '앙' });
          textarea.value = '앙';
          setTimeout(() => { // wait for any textarea updates
            compositionHelper.compositionend();
            setTimeout(() => { // wait for any textarea updates
              assert.equal(handledText, '앙');
              // Second character '앙'
              compositionHelper.compositionstart();
              compositionHelper.compositionupdate({ data: 'ㅇ' });
              textarea.value = '앙ㅇ';
              setTimeout(() => { // wait for any textarea updates
                compositionHelper.compositionupdate({ data: '아' });
                textarea.value = '앙아';
                setTimeout(() => { // wait for any textarea updates
                  compositionHelper.compositionupdate({ data: '앙' });
                  textarea.value = '앙앙';
                  setTimeout(() => { // wait for any textarea updates
                    compositionHelper.compositionend();
                    setTimeout(() => { // wait for any textarea updates
                      assert.equal(handledText, '앙앙');
                      done();
                    }, 0);
                  }, 0);
                }, 0);
              }, 0);
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert complex characters that change with following character', function (done) {
      // First character '아'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'ㅇ' });
      textarea.value = 'ㅇ';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionupdate({ data: '아' });
        textarea.value = '아';
        setTimeout(() => { // wait for any textarea updates
          // Start second character '아' in first character
          compositionHelper.compositionupdate({ data: '앙' });
          textarea.value = '앙';
          setTimeout(() => { // wait for any textarea updates
            compositionHelper.compositionend();
            compositionHelper.compositionstart();
            compositionHelper.compositionupdate({ data: '아' });
            textarea.value = '아아';
            setTimeout(() => { // wait for any textarea updates
              compositionHelper.compositionend();
              setTimeout(() => { // wait for any textarea updates
                assert.equal(handledText, '아아');
                done();
              }, 0);
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert multi-characters compositions', function (done) {
      // First character 'だ'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'd' });
      textarea.value = 'd';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionupdate({ data: 'だ' });
        textarea.value = 'だ';
        setTimeout(() => { // wait for any textarea updates
          // Second character 'あ'
          compositionHelper.compositionupdate({ data: 'だあ' });
          textarea.value = 'だあ';
          setTimeout(() => { // wait for any textarea updates
            compositionHelper.compositionend();
            setTimeout(() => { // wait for any textarea updates
              assert.equal(handledText, 'だあ');
              done();
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert multi-character compositions that are converted to other characters with the same length', function (done) {
      // First character 'だ'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'd' });
      textarea.value = 'd';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionupdate({ data: 'だ' });
        textarea.value = 'だ';
        setTimeout(() => { // wait for any textarea updates
          // Second character 'ー'
          compositionHelper.compositionupdate({ data: 'だー' });
          textarea.value = 'だー';
          setTimeout(() => { // wait for any textarea updates
            // Convert to katakana 'ダー'
            compositionHelper.compositionupdate({ data: 'ダー' });
            textarea.value = 'ダー';
            setTimeout(() => { // wait for any textarea updates
              compositionHelper.compositionend();
              setTimeout(() => { // wait for any textarea updates
                assert.equal(handledText, 'ダー');
                done();
              }, 0);
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert multi-character compositions that are converted to other characters with different lengths', function (done) {
      // First character 'い'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'い' });
      textarea.value = 'い';
      setTimeout(() => { // wait for any textarea updates
        // Second character 'ま'
        compositionHelper.compositionupdate({ data: 'いm' });
        textarea.value = 'いm';
        setTimeout(() => { // wait for any textarea updates
          compositionHelper.compositionupdate({ data: 'いま' });
          textarea.value = 'いま';
          setTimeout(() => { // wait for any textarea updates
            // Convert to kanji '今'
            compositionHelper.compositionupdate({ data: '今' });
            textarea.value = '今';
            setTimeout(() => { // wait for any textarea updates
              compositionHelper.compositionend();
              setTimeout(() => { // wait for any textarea updates
                assert.equal(handledText, '今');
                done();
              }, 0);
            }, 0);
          }, 0);
        }, 0);
      }, 0);
    });

    it('Should insert non-composition characters input immediately after composition characters', function (done) {
      // First character 'ㅇ'
      compositionHelper.compositionstart();
      compositionHelper.compositionupdate({ data: 'ㅇ' });
      textarea.value = 'ㅇ';
      setTimeout(() => { // wait for any textarea updates
        compositionHelper.compositionend();
        // Second character '1' (a non-composition character)
        textarea.value = 'ㅇ1';
        setTimeout(() => { // wait for any textarea updates
          assert.equal(handledText, 'ㅇ1');
          done();
        }, 0);
      }, 0);
    });
  });
});
Commit	Line	Data
3638ef80 DI	1	import { assert } from 'chai';
3638ef80 DI	2	import { CompositionHelper } from './CompositionHelper';
e1c1b07a	3
3638ef80	4	describe('CompositionHelper', () => {
3b166966 DI	5	let terminal;
	6	let compositionHelper;
	7	let compositionView;
	8	let textarea;
	9	let handledText;
e1c1b07a	10
3638ef80	11	beforeEach(() => {
e1c1b07a DI	12	compositionView = {
e1c1b07a DI	13	classList: {
3638ef80 DI	14	add: () => {},
3638ef80 DI	15	remove: () => {},
e1c1b07a	16	},
3638ef80	17	getBoundingClientRect: () => {
ed1a31d1	18	return { width: 0 };
c24ae84b	19	},
e1c1b07a DI	20	style: {
	21	left: 0,
	22	top: 0
	23	},
	24	textContent: ''
7048f6ed	25	};
e1c1b07a	26	textarea = {
89d29bbc DI	27	value: '',
	28	style: {
	29	left: 0,
	30	top: 0
	31	}
7048f6ed	32	};
e1c1b07a DI	33	terminal = {
e1c1b07a DI	34	element: {
3638ef80	35	querySelector: () => {
e1c1b07a DI	36	return { offsetLeft: 0, offsetTop: 0 };
	37	}
	38	},
	39	handler: function (text) {
	40	handledText += text;
e1c1b07a	41	}
7048f6ed	42	};
e1c1b07a	43	handledText = '';
3638ef80	44	compositionHelper = new CompositionHelper(textarea, compositionView, terminal);
e1c1b07a DI	45	});
e1c1b07a DI	46
3638ef80	47	describe('Input', () => {
e1c1b07a	48	it('Should insert simple characters', function (done) {
14a62c0f	49	// First character 'ㅇ'
e1c1b07a DI	50	compositionHelper.compositionstart();
	51	compositionHelper.compositionupdate({ data: 'ㅇ' });
	52	textarea.value = 'ㅇ';
3638ef80	53	setTimeout(() => { // wait for any textarea updates
e1c1b07a	54	compositionHelper.compositionend();
3638ef80	55	setTimeout(() => { // wait for any textarea updates
e1c1b07a	56	assert.equal(handledText, 'ㅇ');
14a62c0f	57	// Second character 'ㅇ'
e1c1b07a DI	58	compositionHelper.compositionstart();
	59	compositionHelper.compositionupdate({ data: 'ㅇ' });
	60	textarea.value = 'ㅇㅇ';
3638ef80	61	setTimeout(() => { // wait for any textarea updates
e1c1b07a	62	compositionHelper.compositionend();
3638ef80	63	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	64	assert.equal(handledText, 'ㅇㅇ');
	65	done();
	66	}, 0);
	67	}, 0);
	68	}, 0);
	69	}, 0);
	70	});
	71
	72	it('Should insert complex characters', function (done) {
14a62c0f	73	// First character '앙'
e1c1b07a DI	74	compositionHelper.compositionstart();
	75	compositionHelper.compositionupdate({ data: 'ㅇ' });
	76	textarea.value = 'ㅇ';
3638ef80	77	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	78	compositionHelper.compositionupdate({ data: '아' });
e1c1b07a DI	79	textarea.value = '아';
3638ef80	80	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	81	compositionHelper.compositionupdate({ data: '앙' });
e1c1b07a DI	82	textarea.value = '앙';
3638ef80	83	setTimeout(() => { // wait for any textarea updates
e1c1b07a	84	compositionHelper.compositionend();
3638ef80	85	setTimeout(() => { // wait for any textarea updates
e1c1b07a	86	assert.equal(handledText, '앙');
14a62c0f	87	// Second character '앙'
e1c1b07a DI	88	compositionHelper.compositionstart();
	89	compositionHelper.compositionupdate({ data: 'ㅇ' });
	90	textarea.value = '앙ㅇ';
3638ef80	91	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	92	compositionHelper.compositionupdate({ data: '아' });
e1c1b07a DI	93	textarea.value = '앙아';
3638ef80	94	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	95	compositionHelper.compositionupdate({ data: '앙' });
e1c1b07a DI	96	textarea.value = '앙앙';
3638ef80	97	setTimeout(() => { // wait for any textarea updates
e1c1b07a	98	compositionHelper.compositionend();
3638ef80	99	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	100	assert.equal(handledText, '앙앙');
	101	done();
	102	}, 0);
	103	}, 0);
	104	}, 0);
	105	}, 0);
	106	}, 0);
	107	}, 0);
	108	}, 0);
	109	}, 0);
	110	});
	111
	112	it('Should insert complex characters that change with following character', function (done) {
14a62c0f	113	// First character '아'
e1c1b07a DI	114	compositionHelper.compositionstart();
	115	compositionHelper.compositionupdate({ data: 'ㅇ' });
	116	textarea.value = 'ㅇ';
3638ef80	117	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	118	compositionHelper.compositionupdate({ data: '아' });
e1c1b07a DI	119	textarea.value = '아';
3638ef80	120	setTimeout(() => { // wait for any textarea updates
14a62c0f	121	// Start second character '아' in first character
e1c1b07a DI	122	compositionHelper.compositionupdate({ data: '앙' });
e1c1b07a DI	123	textarea.value = '앙';
3638ef80	124	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	125	compositionHelper.compositionend();
	126	compositionHelper.compositionstart();
	127	compositionHelper.compositionupdate({ data: '아' });
3b166966	128	textarea.value = '아아';
3638ef80	129	setTimeout(() => { // wait for any textarea updates
e1c1b07a	130	compositionHelper.compositionend();
3638ef80	131	setTimeout(() => { // wait for any textarea updates
e1c1b07a DI	132	assert.equal(handledText, '아아');
	133	done();
	134	}, 0);
	135	}, 0);
	136	}, 0);
	137	}, 0);
	138	}, 0);
	139	});
	140
14a62c0f DI	141	it('Should insert multi-characters compositions', function (done) {
	142	// First character 'だ'
	143	compositionHelper.compositionstart();
	144	compositionHelper.compositionupdate({ data: 'd' });
	145	textarea.value = 'd';
3638ef80	146	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	147	compositionHelper.compositionupdate({ data: 'だ' });
14a62c0f DI	148	textarea.value = 'だ';
3638ef80	149	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	150	// Second character 'あ'
	151	compositionHelper.compositionupdate({ data: 'だあ' });
	152	textarea.value = 'だあ';
3638ef80	153	setTimeout(() => { // wait for any textarea updates
14a62c0f	154	compositionHelper.compositionend();
3638ef80	155	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	156	assert.equal(handledText, 'だあ');
	157	done();
	158	}, 0);
	159	}, 0);
	160	}, 0);
	161	}, 0);
e1c1b07a DI	162	});
e1c1b07a DI	163
14a62c0f DI	164	it('Should insert multi-character compositions that are converted to other characters with the same length', function (done) {
	165	// First character 'だ'
	166	compositionHelper.compositionstart();
	167	compositionHelper.compositionupdate({ data: 'd' });
	168	textarea.value = 'd';
3638ef80	169	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	170	compositionHelper.compositionupdate({ data: 'だ' });
14a62c0f DI	171	textarea.value = 'だ';
3638ef80	172	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	173	// Second character 'ー'
	174	compositionHelper.compositionupdate({ data: 'だー' });
	175	textarea.value = 'だー';
3638ef80	176	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	177	// Convert to katakana 'ダー'
	178	compositionHelper.compositionupdate({ data: 'ダー' });
	179	textarea.value = 'ダー';
3638ef80	180	setTimeout(() => { // wait for any textarea updates
14a62c0f	181	compositionHelper.compositionend();
3638ef80	182	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	183	assert.equal(handledText, 'ダー');
	184	done();
	185	}, 0);
	186	}, 0);
	187	}, 0);
	188	}, 0);
	189	}, 0);
3b166966	190	});
14a62c0f DI	191
	192	it('Should insert multi-character compositions that are converted to other characters with different lengths', function (done) {
	193	// First character 'い'
	194	compositionHelper.compositionstart();
	195	compositionHelper.compositionupdate({ data: 'い' });
	196	textarea.value = 'い';
3638ef80	197	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	198	// Second character 'ま'
	199	compositionHelper.compositionupdate({ data: 'いm' });
	200	textarea.value = 'いm';
3638ef80	201	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	202	compositionHelper.compositionupdate({ data: 'いま' });
14a62c0f DI	203	textarea.value = 'いま';
3638ef80	204	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	205	// Convert to kanji '今'
	206	compositionHelper.compositionupdate({ data: '今' });
	207	textarea.value = '今';
3638ef80	208	setTimeout(() => { // wait for any textarea updates
14a62c0f	209	compositionHelper.compositionend();
3638ef80	210	setTimeout(() => { // wait for any textarea updates
14a62c0f DI	211	assert.equal(handledText, '今');
	212	done();
	213	}, 0);
	214	}, 0);
	215	}, 0);
	216	}, 0);
	217	}, 0);
e1c1b07a	218	});
89d29bbc	219
14a62c0f DI	220	it('Should insert non-composition characters input immediately after composition characters', function (done) {
14a62c0f DI	221	// First character 'ㅇ'
89d29bbc DI	222	compositionHelper.compositionstart();
	223	compositionHelper.compositionupdate({ data: 'ㅇ' });
	224	textarea.value = 'ㅇ';
3638ef80	225	setTimeout(() => { // wait for any textarea updates
89d29bbc	226	compositionHelper.compositionend();
14a62c0f	227	// Second character '1' (a non-composition character)
89d29bbc	228	textarea.value = 'ㅇ1';
3638ef80	229	setTimeout(() => { // wait for any textarea updates
89d29bbc DI	230	assert.equal(handledText, 'ㅇ1');
	231	done();
	232	}, 0);
	233	}, 0);
	234	});
e1c1b07a DI	235	});
e1c1b07a DI	236	});