@@ -25,6 +25,7 @@ define(function (require, exports, module) {
2525
2626
2727 const SpecRunnerUtils = require ( "spec/SpecRunnerUtils" ) ,
28+ KeyEvent = require ( "utils/KeyEvent" ) ,
2829 StringUtils = require ( "utils/StringUtils" ) ;
2930
3031 describe ( "livepreview:MultiBrowser Live Preview" , function ( ) {
@@ -480,6 +481,109 @@ define(function (require, exports, module) {
480481 await endPreviewSession ( ) ;
481482 } , 30000 ) ;
482483
484+ async function _openCodeHints ( cursor , expectedSomeHintsArray ) {
485+ let editor = EditorManager . getActiveEditor ( ) ;
486+ editor . setCursorPos ( cursor ) ;
487+
488+ await awaitsForDone ( CommandManager . execute ( Commands . SHOW_CODE_HINTS ) ,
489+ "show code hints" ) ;
490+
491+ await awaitsFor ( function ( ) {
492+ return testWindow . $ ( ".codehint-menu" ) . is ( ":visible" ) ;
493+ } , "codehints to be shown" ) ;
494+
495+ await awaitsFor ( function ( ) {
496+ for ( let hint of expectedSomeHintsArray ) {
497+ if ( ! testWindow . $ ( ".codehint-menu" ) . text ( ) . includes ( hint ) ) {
498+ return false ;
499+ }
500+ }
501+ return true ;
502+ } , "expected hints to be there" ) ;
503+ }
504+
505+ async function _waitForLivePreviewElementColor ( elementID , color ) {
506+ let result ;
507+ await awaitsFor (
508+ async function isColorChanged ( ) {
509+ const response = await LiveDevProtocol . evaluate (
510+ `window.getComputedStyle(document.getElementById('${ elementID } ')).color` ) ;
511+ result = JSON . parse ( response . result || "" ) ;
512+ return result === color ;
513+ } ,
514+ `element #${ elementID } to color ${ color } ` ,
515+ 5000 ,
516+ 50
517+ ) ;
518+ }
519+
520+ async function _livePreviewCodeHintsHTML ( ) {
521+ await awaitsForDone ( SpecRunnerUtils . openProjectFiles ( [ "inline-style.html" ] ) ,
522+ "SpecRunnerUtils.openProjectFiles inline-style.html" ) ;
523+
524+ await waitsForLiveDevelopmentToOpen ( ) ;
525+ await awaitsForDone ( SpecRunnerUtils . openProjectFiles ( [ "inline-style.html" ] ) ,
526+ "inline-style.html" ) ;
527+
528+ await awaitsFor ( ( ) => LiveDevMultiBrowser . status === LiveDevMultiBrowser . STATUS_ACTIVE ,
529+ "status active" ) ;
530+
531+ await _openCodeHints ( { line : 9 , ch : 18 } , [ "red" ] ) ;
532+
533+ let editor = EditorManager . getActiveEditor ( ) ;
534+ const initialHistoryLength = editor . getHistory ( ) . done . length ;
535+ SpecRunnerUtils . simulateKeyEvent ( KeyEvent . DOM_VK_DOWN , "keydown" , testWindow . document . body ) ;
536+ await awaitsFor ( function ( ) {
537+ return editor . getSelectedText ( ) === "indianred" ;
538+ } , "expected live hints to update selection to indianred" ) ;
539+ await _waitForLivePreviewElementColor ( "testId" , "rgb(205, 92, 92)" ) ; // indian red
540+ SpecRunnerUtils . simulateKeyEvent ( KeyEvent . DOM_VK_DOWN , "keydown" , testWindow . document . body ) ;
541+ await awaitsFor ( function ( ) {
542+ return editor . getSelectedText ( ) === "mediumvioletred" ;
543+ } , "expected live hints to update selection to mediumvioletred" ) ;
544+ await _waitForLivePreviewElementColor ( "testId" , "rgb(199, 21, 133)" ) ;
545+ return initialHistoryLength ;
546+ }
547+
548+ it ( "should Live preview push css code hints selection changes to browser(inline html)" , async function ( ) {
549+ const expectedHistoryLength = await _livePreviewCodeHintsHTML ( ) ;
550+ let editor = EditorManager . getActiveEditor ( ) ;
551+
552+ // now dismiss with escape
553+ SpecRunnerUtils . simulateKeyEvent ( KeyEvent . DOM_VK_ESCAPE , "keydown" , testWindow . document . body ) ;
554+ await awaitsFor ( function ( ) {
555+ return ! testWindow . $ ( ".codehint-menu" ) . is ( ":visible" ) ;
556+ } , "codehints to be hidden" ) ;
557+ await awaitsFor ( function ( ) {
558+ return editor . getSelectedText ( ) === "" ;
559+ } , "to restore the text to old state" ) ;
560+ expect ( editor . getToken ( ) . string ) . toBe ( "red" ) ;
561+
562+ // the undo history should be same as when we started
563+ expect ( editor . getHistory ( ) . done . length ) . toBe ( expectedHistoryLength ) ;
564+ await endPreviewSession ( ) ;
565+ } , 30000 ) ;
566+
567+ it ( "should Live preview push css code hints selection changes to browser and commit(inline html)" , async function ( ) {
568+ const expectedHistoryLength = await _livePreviewCodeHintsHTML ( ) ;
569+ let editor = EditorManager . getActiveEditor ( ) ;
570+
571+ // commit with enter key
572+ SpecRunnerUtils . simulateKeyEvent ( KeyEvent . DOM_VK_RETURN , "keydown" , testWindow . document . body ) ;
573+ await awaitsFor ( function ( ) {
574+ return ! testWindow . $ ( ".codehint-menu" ) . is ( ":visible" ) ;
575+ } , "codehints to be hidden" ) ;
576+ await awaitsFor ( function ( ) {
577+ return editor . getSelectedText ( ) === "" ;
578+ } , "to restore the text to old state" ) ;
579+ // check if we have the new value
580+ expect ( editor . getToken ( ) . string ) . toBe ( "mediumvioletred" ) ;
581+
582+ // the undo history should be just one above
583+ expect ( editor . getHistory ( ) . done . length ) . toBe ( expectedHistoryLength + 3 ) ;
584+ await endPreviewSession ( ) ;
585+ } , 30000 ) ;
586+
483587 it ( "should Live preview work even if we switch html files" , async function ( ) {
484588 await awaitsForDone ( SpecRunnerUtils . openProjectFiles ( [ "simple1.html" ] ) ,
485589 "SpecRunnerUtils.openProjectFiles simple1.html" ) ;
0 commit comments