tests/test.keyboard.js

   1 var assert = chai.assert;
   2 var expect = chai.expect;
   3
   4 import sinon from '../vendor/sinon.js';
   5
   6 import Keyboard from '../core/input/keyboard.js';
   7
   8 function isIE() {
   9     return navigator && !!(/trident/i).exec(navigator.userAgent);
  10 }
  11 function isEdge() {
  12     return navigator && !!(/edge/i).exec(navigator.userAgent);
  13 }
  14
  15 /* jshint newcap: false, expr: true */
  16 describe('Key Event Handling', function() {
  17     "use strict";
  18
  19     // The real KeyboardEvent constructor might not work everywhere we
  20     // want to run these tests
  21     function keyevent(typeArg, KeyboardEventInit) {
  22         var e = { type: typeArg };
  23         for (var key in KeyboardEventInit) {
  24             e[key] = KeyboardEventInit[key];
  25         }
  26         e.stopPropagation = sinon.spy();
  27         e.preventDefault = sinon.spy();
  28         return e;
  29     };
  30
  31     describe('Decode Keyboard Events', function() {
  32         it('should decode keydown events', function(done) {
  33             if (isIE() || isEdge()) this.skip();
  34             var kbd = new Keyboard({
  35             onKeyEvent: function(keysym, code, down) {
  36                 expect(keysym).to.be.equal(0x61);
  37                 expect(code).to.be.equal('KeyA');
  38                 expect(down).to.be.equal(true);
  39                 done();
  40             }});
  41             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
  42         });
  43         it('should decode keyup events', function(done) {
  44             if (isIE() || isEdge()) this.skip();
  45             var calls = 0;
  46             var kbd = new Keyboard({
  47             onKeyEvent: function(keysym, code, down) {
  48                 expect(keysym).to.be.equal(0x61);
  49                 expect(code).to.be.equal('KeyA');
  50                 if (calls++ === 1) {
  51                     expect(down).to.be.equal(false);
  52                     done();
  53                 }
  54             }});
  55             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
  56             kbd._handleKeyUp(keyevent('keyup', {code: 'KeyA', key: 'a'}));
  57         });
  58
  59         describe('Legacy keypress Events', function() {
  60             it('should wait for keypress when needed', function() {
  61                 var callback = sinon.spy();
  62                 var kbd = new Keyboard({onKeyEvent: callback});
  63                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41}));
  64                 expect(callback).to.not.have.been.called;
  65             });
  66             it('should decode keypress events', function(done) {
  67                 var kbd = new Keyboard({
  68                 onKeyEvent: function(keysym, code, down) {
  69                     expect(keysym).to.be.equal(0x61);
  70                     expect(code).to.be.equal('KeyA');
  71                     expect(down).to.be.equal(true);
  72                     done();
  73                 }});
  74                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41}));
  75                 kbd._handleKeyPress(keyevent('keypress', {code: 'KeyA', charCode: 0x61}));
  76             });
  77             it('should ignore keypress with different code', function() {
  78                 var callback = sinon.spy();
  79                 var kbd = new Keyboard({onKeyEvent: callback});
  80                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41}));
  81                 kbd._handleKeyPress(keyevent('keypress', {code: 'KeyB', charCode: 0x61}));
  82                 expect(callback).to.not.have.been.called;
  83             });
  84             it('should handle keypress with missing code', function(done) {
  85                 var kbd = new Keyboard({
  86                 onKeyEvent: function(keysym, code, down) {
  87                     expect(keysym).to.be.equal(0x61);
  88                     expect(code).to.be.equal('KeyA');
  89                     expect(down).to.be.equal(true);
  90                     done();
  91                 }});
  92                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41}));
  93                 kbd._handleKeyPress(keyevent('keypress', {charCode: 0x61}));
  94             });
  95             it('should guess key if no keypress and numeric key', function(done) {
  96                 var kbd = new Keyboard({
  97                 onKeyEvent: function(keysym, code, down) {
  98                     expect(keysym).to.be.equal(0x32);
  99                     expect(code).to.be.equal('Digit2');
 100                     expect(down).to.be.equal(true);
 101                     done();
 102                 }});
 103                 kbd._handleKeyDown(keyevent('keydown', {code: 'Digit2', keyCode: 0x32}));
 104             });
 105             it('should guess key if no keypress and alpha key', function(done) {
 106                 var kbd = new Keyboard({
 107                 onKeyEvent: function(keysym, code, down) {
 108                     expect(keysym).to.be.equal(0x61);
 109                     expect(code).to.be.equal('KeyA');
 110                     expect(down).to.be.equal(true);
 111                     done();
 112                 }});
 113                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41, shiftKey: false}));
 114             });
 115             it('should guess key if no keypress and alpha key (with shift)', function(done) {
 116                 var kbd = new Keyboard({
 117                 onKeyEvent: function(keysym, code, down) {
 118                     expect(keysym).to.be.equal(0x41);
 119                     expect(code).to.be.equal('KeyA');
 120                     expect(down).to.be.equal(true);
 121                     done();
 122                 }});
 123                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x41, shiftKey: true}));
 124             });
 125             it('should not guess key if no keypress and unknown key', function(done) {
 126                 var kbd = new Keyboard({
 127                 onKeyEvent: function(keysym, code, down) {
 128                     expect(keysym).to.be.equal(0);
 129                     expect(code).to.be.equal('KeyA');
 130                     expect(down).to.be.equal(true);
 131                     done();
 132                 }});
 133                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', keyCode: 0x09}));
 134             });
 135         });
 136
 137         describe('suppress the right events at the right time', function() {
 138             beforeEach(function () {
 139                 if (isIE() || isEdge()) this.skip();
 140             });
 141             it('should suppress anything with a valid key', function() {
 142                 var kbd = new Keyboard({});
 143                 var evt = keyevent('keydown', {code: 'KeyA', key: 'a'});
 144                 kbd._handleKeyDown(evt);
 145                 expect(evt.preventDefault).to.have.been.called;
 146                 evt = keyevent('keyup', {code: 'KeyA', key: 'a'});
 147                 kbd._handleKeyUp(evt);
 148                 expect(evt.preventDefault).to.have.been.called;
 149             });
 150             it('should not suppress keys without key', function() {
 151                 var kbd = new Keyboard({});
 152                 var evt = keyevent('keydown', {code: 'KeyA', keyCode: 0x41});
 153                 kbd._handleKeyDown(evt);
 154                 expect(evt.preventDefault).to.not.have.been.called;
 155             });
 156             it('should suppress the following keypress event', function() {
 157                 var kbd = new Keyboard({});
 158                 var evt = keyevent('keydown', {code: 'KeyA', keyCode: 0x41});
 159                 kbd._handleKeyDown(evt);
 160                 var evt = keyevent('keypress', {code: 'KeyA', charCode: 0x41});
 161                 kbd._handleKeyPress(evt);
 162                 expect(evt.preventDefault).to.have.been.called;
 163             });
 164         });
 165     });
 166
 167     describe('Fake keyup', function() {
 168         it('should fake keyup events for virtual keyboards', function(done) {
 169             if (isIE() || isEdge()) this.skip();
 170             var count = 0;
 171             var kbd = new Keyboard({
 172             onKeyEvent: function(keysym, code, down) {
 173                 switch (count++) {
 174                     case 0:
 175                         expect(keysym).to.be.equal(0x61);
 176                         expect(code).to.be.equal('Unidentified');
 177                         expect(down).to.be.equal(true);
 178                         break;
 179                     case 1:
 180                         expect(keysym).to.be.equal(0x61);
 181                         expect(code).to.be.equal('Unidentified');
 182                         expect(down).to.be.equal(false);
 183                         done();
 184                 }
 185             }});
 186             kbd._handleKeyDown(keyevent('keydown', {code: 'Unidentified', key: 'a'}));
 187         });
 188
 189         describe('iOS', function() {
 190             var origNavigator;
 191             beforeEach(function () {
 192                 // window.navigator is a protected read-only property in many
 193                 // environments, so we need to redefine it whilst running these
 194                 // tests.
 195                 origNavigator = Object.getOwnPropertyDescriptor(window, "navigator");
 196                 if (origNavigator === undefined) {
 197                     // Object.getOwnPropertyDescriptor() doesn't work
 198                     // properly in any version of IE
 199                     this.skip();
 200                 }
 201
 202                 Object.defineProperty(window, "navigator", {value: {}});
 203                 if (window.navigator.platform !== undefined) {
 204                     // Object.defineProperty() doesn't work properly in old
 205                     // versions of Chrome
 206                     this.skip();
 207                 }
 208
 209                 window.navigator.platform = "iPhone 9.0";
 210             });
 211             afterEach(function () {
 212                 Object.defineProperty(window, "navigator", origNavigator);
 213             });
 214
 215             it('should fake keyup events on iOS', function(done) {
 216                 if (isIE() || isEdge()) this.skip();
 217                 var count = 0;
 218                 var kbd = new Keyboard({
 219                 onKeyEvent: function(keysym, code, down) {
 220                     switch (count++) {
 221                         case 0:
 222                             expect(keysym).to.be.equal(0x61);
 223                             expect(code).to.be.equal('KeyA');
 224                             expect(down).to.be.equal(true);
 225                             break;
 226                         case 1:
 227                             expect(keysym).to.be.equal(0x61);
 228                             expect(code).to.be.equal('KeyA');
 229                             expect(down).to.be.equal(false);
 230                             done();
 231                     }
 232                 }});
 233                 kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
 234             });
 235         });
 236     });
 237
 238     describe('Track Key State', function() {
 239         beforeEach(function () {
 240             if (isIE() || isEdge()) this.skip();
 241         });
 242         it('should send release using the same keysym as the press', function(done) {
 243             var kbd = new Keyboard({
 244             onKeyEvent: function(keysym, code, down) {
 245                 expect(keysym).to.be.equal(0x61);
 246                 expect(code).to.be.equal('KeyA');
 247                 if (!down) {
 248                     done();
 249                 }
 250             }});
 251             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
 252             kbd._handleKeyUp(keyevent('keyup', {code: 'KeyA', key: 'b'}));
 253         });
 254         it('should send the same keysym for multiple presses', function() {
 255             var count = 0;
 256             var kbd = new Keyboard({
 257             onKeyEvent: function(keysym, code, down) {
 258                 expect(keysym).to.be.equal(0x61);
 259                 expect(code).to.be.equal('KeyA');
 260                 expect(down).to.be.equal(true);
 261                 count++;
 262             }});
 263             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
 264             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'b'}));
 265             expect(count).to.be.equal(2);
 266         });
 267         it('should do nothing on keyup events if no keys are down', function() {
 268             var callback = sinon.spy();
 269             var kbd = new Keyboard({onKeyEvent: callback});
 270             kbd._handleKeyUp(keyevent('keyup', {code: 'KeyA', key: 'a'}));
 271             expect(callback).to.not.have.been.called;
 272         });
 273
 274         describe('Legacy Events', function() {
 275             it('should track keys using keyCode if no code', function(done) {
 276                 var kbd = new Keyboard({
 277                 onKeyEvent: function(keysym, code, down) {
 278                     expect(keysym).to.be.equal(0x61);
 279                     expect(code).to.be.equal('Platform65');
 280                     if (!down) {
 281                         done();
 282                     }
 283                 }});
 284                 kbd._handleKeyDown(keyevent('keydown', {keyCode: 65, key: 'a'}));
 285                 kbd._handleKeyUp(keyevent('keyup', {keyCode: 65, key: 'b'}));
 286             });
 287             it('should ignore compositing code', function() {
 288                 var kbd = new Keyboard({
 289                 onKeyEvent: function(keysym, code, down) {
 290                     expect(keysym).to.be.equal(0x61);
 291                     expect(code).to.be.equal('Unidentified');
 292                 }});
 293                 kbd._handleKeyDown(keyevent('keydown', {keyCode: 229, key: 'a'}));
 294             });
 295             it('should track keys using keyIdentifier if no code', function(done) {
 296                 var kbd = new Keyboard({
 297                 onKeyEvent: function(keysym, code, down) {
 298                     expect(keysym).to.be.equal(0x61);
 299                     expect(code).to.be.equal('Platform65');
 300                     if (!down) {
 301                         done();
 302                     }
 303                 }});
 304                 kbd._handleKeyDown(keyevent('keydown', {keyIdentifier: 'U+0041', key: 'a'}));
 305                 kbd._handleKeyUp(keyevent('keyup', {keyIdentifier: 'U+0041', key: 'b'}));
 306             });
 307         });
 308     });
 309
 310     describe('Shuffle modifiers on macOS', function() {
 311         var origNavigator;
 312         beforeEach(function () {
 313             // window.navigator is a protected read-only property in many
 314             // environments, so we need to redefine it whilst running these
 315             // tests.
 316             origNavigator = Object.getOwnPropertyDescriptor(window, "navigator");
 317             if (origNavigator === undefined) {
 318                 // Object.getOwnPropertyDescriptor() doesn't work
 319                 // properly in any version of IE
 320                 this.skip();
 321             }
 322
 323             Object.defineProperty(window, "navigator", {value: {}});
 324             if (window.navigator.platform !== undefined) {
 325                 // Object.defineProperty() doesn't work properly in old
 326                 // versions of Chrome
 327                 this.skip();
 328             }
 329
 330             window.navigator.platform = "Mac x86_64";
 331         });
 332         afterEach(function () {
 333             Object.defineProperty(window, "navigator", origNavigator);
 334         });
 335
 336         it('should change Alt to AltGraph', function() {
 337             var count = 0;
 338             var kbd = new Keyboard({
 339             onKeyEvent: function(keysym, code, down) {
 340                 switch (count++) {
 341                     case 0:
 342                         expect(keysym).to.be.equal(0xFF7E);
 343                         expect(code).to.be.equal('AltLeft');
 344                         break;
 345                     case 1:
 346                         expect(keysym).to.be.equal(0xFE03);
 347                         expect(code).to.be.equal('AltRight');
 348                         break;
 349                 }
 350             }});
 351             kbd._handleKeyDown(keyevent('keydown', {code: 'AltLeft', key: 'Alt', location: 1}));
 352             kbd._handleKeyDown(keyevent('keydown', {code: 'AltRight', key: 'Alt', location: 2}));
 353             expect(count).to.be.equal(2);
 354         });
 355         it('should change left Super to Alt', function(done) {
 356             var kbd = new Keyboard({
 357             onKeyEvent: function(keysym, code, down) {
 358                 expect(keysym).to.be.equal(0xFFE9);
 359                 expect(code).to.be.equal('MetaLeft');
 360                 done();
 361             }});
 362             kbd._handleKeyDown(keyevent('keydown', {code: 'MetaLeft', key: 'Meta', location: 1}));
 363         });
 364         it('should change right Super to left Super', function(done) {
 365             var kbd = new Keyboard({
 366             onKeyEvent: function(keysym, code, down) {
 367                 expect(keysym).to.be.equal(0xFFEB);
 368                 expect(code).to.be.equal('MetaRight');
 369                 done();
 370             }});
 371             kbd._handleKeyDown(keyevent('keydown', {code: 'MetaRight', key: 'Meta', location: 2}));
 372         });
 373     });
 374
 375     describe('Escape AltGraph on Windows', function() {
 376         var origNavigator;
 377         beforeEach(function () {
 378             // window.navigator is a protected read-only property in many
 379             // environments, so we need to redefine it whilst running these
 380             // tests.
 381             origNavigator = Object.getOwnPropertyDescriptor(window, "navigator");
 382             if (origNavigator === undefined) {
 383                 // Object.getOwnPropertyDescriptor() doesn't work
 384                 // properly in any version of IE
 385                 this.skip();
 386             }
 387
 388             Object.defineProperty(window, "navigator", {value: {}});
 389             if (window.navigator.platform !== undefined) {
 390                 // Object.defineProperty() doesn't work properly in old
 391                 // versions of Chrome
 392                 this.skip();
 393             }
 394
 395             window.navigator.platform = "Windows x86_64";
 396         });
 397         afterEach(function () {
 398             Object.defineProperty(window, "navigator", origNavigator);
 399         });
 400
 401         it('should generate fake undo/redo events on press when AltGraph is down', function() {
 402             var times_called = 0;
 403             var kbd = new Keyboard({
 404             onKeyEvent: function(keysym, code, down) {
 405                 switch(times_called++) {
 406                 case 0:
 407                     expect(keysym).to.be.equal(0xFFE3);
 408                     expect(code).to.be.equal('ControlLeft');
 409                     expect(down).to.be.equal(true);
 410                     break;
 411                 case 1:
 412                     expect(keysym).to.be.equal(0xFFEA);
 413                     expect(code).to.be.equal('AltRight');
 414                     expect(down).to.be.equal(true);
 415                     break;
 416                 case 2:
 417                     expect(keysym).to.be.equal(0xFFEA);
 418                     expect(code).to.be.equal('AltRight');
 419                     expect(down).to.be.equal(false);
 420                     break;
 421                 case 3:
 422                     expect(keysym).to.be.equal(0xFFE3);
 423                     expect(code).to.be.equal('ControlLeft');
 424                     expect(down).to.be.equal(false);
 425                     break;
 426                 case 4:
 427                     expect(keysym).to.be.equal(0x61);
 428                     expect(code).to.be.equal('KeyA');
 429                     expect(down).to.be.equal(true);
 430                     break;
 431                 case 5:
 432                     expect(keysym).to.be.equal(0xFFE3);
 433                     expect(code).to.be.equal('ControlLeft');
 434                     expect(down).to.be.equal(true);
 435                     break;
 436                 case 6:
 437                     expect(keysym).to.be.equal(0xFFEA);
 438                     expect(code).to.be.equal('AltRight');
 439                     expect(down).to.be.equal(true);
 440                     break;
 441                 }
 442             }});
 443             // First the modifier combo
 444             kbd._handleKeyDown(keyevent('keydown', {code: 'ControlLeft', key: 'Control', location: 1}));
 445             kbd._handleKeyDown(keyevent('keydown', {code: 'AltRight', key: 'Alt', location: 2}));
 446             // Next a normal character
 447             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
 448             expect(times_called).to.be.equal(7);
 449         });
 450         it('should no do anything on key release', function() {
 451             var times_called = 0;
 452             var kbd = new Keyboard({
 453             onKeyEvent: function(keysym, code, down) {
 454                 switch(times_called++) {
 455                 case 7:
 456                     expect(keysym).to.be.equal(0x61);
 457                     expect(code).to.be.equal('KeyA');
 458                     expect(down).to.be.equal(false);
 459                     break;
 460                 }
 461             }});
 462             // First the modifier combo
 463             kbd._handleKeyDown(keyevent('keydown', {code: 'ControlLeft', key: 'Control', location: 1}));
 464             kbd._handleKeyDown(keyevent('keydown', {code: 'AltRight', key: 'Alt', location: 2}));
 465             // Next a normal character
 466             kbd._handleKeyDown(keyevent('keydown', {code: 'KeyA', key: 'a'}));
 467             kbd._handleKeyUp(keyevent('keyup', {code: 'KeyA', key: 'a'}));
 468             expect(times_called).to.be.equal(8);
 469         });
 470         it('should not consider a char modifier to be down on the modifier key itself', function() {
 471             var times_called = 0;
 472             var kbd = new Keyboard({
 473             onKeyEvent: function(keysym, code, down) {
 474                 switch(times_called++) {
 475                 case 0:
 476                     expect(keysym).to.be.equal(0xFFE3);
 477                     expect(code).to.be.equal('ControlLeft');
 478                     expect(down).to.be.equal(true);
 479                     break;
 480                 case 1:
 481                     expect(keysym).to.be.equal(0xFFE9);
 482                     expect(code).to.be.equal('AltLeft');
 483                     expect(down).to.be.equal(true);
 484                     break;
 485                 case 2:
 486                     expect(keysym).to.be.equal(0xFFE3);
 487                     expect(code).to.be.equal('ControlLeft');
 488                     expect(down).to.be.equal(true);
 489                     break;
 490                 }
 491             }});
 492             // First the modifier combo
 493             kbd._handleKeyDown(keyevent('keydown', {code: 'ControlLeft', key: 'Control', location: 1}));
 494             kbd._handleKeyDown(keyevent('keydown', {code: 'AltLeft', key: 'Alt', location: 1}));
 495             // Then one of the keys again
 496             kbd._handleKeyDown(keyevent('keydown', {code: 'ControlLeft', key: 'Control', location: 1}));
 497             expect(times_called).to.be.equal(3);
 498         });
 499     });
 500 });