Skip to content

Commit 2de0f9a

Browse files
committed
test: live preview code hints integ test 1
1 parent 74a70fd commit 2de0f9a

File tree

2 files changed

+123
-0
lines changed

2 files changed

+123
-0
lines changed
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Simple Test</title>
6+
<link rel="stylesheet" href="simpleShared.css">
7+
<link rel="stylesheet" href="simple1.css">
8+
<style>
9+
#testId {
10+
color: red;
11+
}
12+
</style>
13+
</head>
14+
15+
<body class="testClass">
16+
<p id="testId" class="testClass">Brackets is awesome!</p>
17+
<p id ="testId2" class="testClass2" >Red is bad. Green is good.</p>
18+
</body>
19+
</html>

test/spec/LiveDevelopmentMultiBrowser-test.js

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -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

Comments
 (0)