LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html - Issue 17450016: Implementation of CSS3 nav-up/down/left/right properties from CSS3 UI.

Side by Side Diff: LayoutTests/fast/spatial-navigation/snav-css-nav-direction.html

Issue 17450016: Implementation of CSS3 nav-up/down/left/right properties from CSS3 UI. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Fixed compilation error in mac and crash in linux/window that were reported by trybots. Created 6 years, 2 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <html>

	3 <head>

	4 <script src="../../resources/js-test.js"></script>

	5 <script src="resources/spatial-navigation-utils.js"></script>

	6 <script type="application/javascript">

	7 jsTestIsAsync = true;

	8

	9 var resultMap = [

	10 ["Right", "e9"],

	11 ["Up", "e9"],

	12 ["Right", "e5"],

	13 ["Up", "e2"],

	14 ["Left", "e4"],

	15 ["Left", "e6"],

	16 ["Down", "e8"],

	17 ["Down", "fr1"],

	18 ["Down", "e5"],

	19 ["DONE", "DONE"]

	20 ];

	21

	22 if (window.testRunner) {

	23 testRunner.overridePreference("WebKitTabToLinksPreferenceKey", 1);

	24 window.internals.settings.setSpatialNavigationEnabled(true);

	25 }

	26

	27 function testParsingAndSerialization()

	28 {

	29 e5_navUp = window.getComputedStyle(document.getElementById("e5")).getPropert yCSSValue('nav-up');
	Timothy Loh 2014/10/01 13:14:53 getPropertyCSSValue and the CSSValue interface are getPropertyCSSValue and the CSSValue interface are deprecated and on their way out, I wouldn't use them in new tests. Some example tests that you might want (using css-parser/resources/property-parsing-test.js): assert_valid_value("nav-left", "auto"); assert_valid_value("nav-up", "#a", "#a current"); assert_valid_value("nav-right", "#bb current"); assert_valid_value("nav-down", "#ccc root"); assert_valid_value("nav-left", '#dd "hello world!"'); assert_invalid_value("nav-left", "#x bar"); assert_invalid_value("nav-up", "#x current 123"); assert_invalid_value("nav-right", "# current"); x.style.navLeft = "#a root"; assert_equals(getComputedStyle(x).navLeft, "#a root");
	30 shouldBe("e5_navUp.cssValueType", "CSSValue.CSS_VALUE_LIST");

	31 shouldBeEqualToNumber("e5_navUp.length", 2);

	32 shouldBe("e5_navUp[0].cssValueType", "CSSValue.CSS_PRIMITIVE_VALUE");

	33 shouldBe("e5_navUp[0].primitiveType", "CSSPrimitiveValue.CSS_STRING");

	34 shouldBeEqualToString("e5_navUp[0].getStringValue()", "#e2");

	35 shouldBe("e5_navUp[1].cssValueType", "CSSValue.CSS_PRIMITIVE_VALUE");

	36 shouldBe("e5_navUp[1].primitiveType", "CSSPrimitiveValue.CSS_IDENT");

	37 shouldBeEqualToString("e5_navUp[1].getStringValue()", "current");

	38 e6_navDown = window.getComputedStyle(document.getElementById("e6")).getPrope rtyCSSValue('nav-down');

	39 shouldBe("e6_navDown.cssValueType", "CSSValue.CSS_VALUE_LIST");

	40 shouldBeEqualToNumber("e6_navDown.length", 2);

	41 shouldBe("e6_navDown[1].primitiveType", "CSSPrimitiveValue.CSS_IDENT");

	42 shouldBeEqualToString("e6_navDown[1].getStringValue()", "current");

	43 e8_navDown = window.getComputedStyle(document.getElementById("e8")).getPrope rtyCSSValue('nav-down');

	44 shouldBe("e8_navDown.cssValueType", "CSSValue.CSS_VALUE_LIST");

	45 shouldBeEqualToNumber("e8_navDown.length", 2);

	46 shouldBe("e8_navDown[1].primitiveType", "CSSPrimitiveValue.CSS_STRING");

	47 shouldBeEqualToString("e8_navDown[1].getStringValue()", "current");

	48 }

	49

	50 function testNavigation()

	51 {

	52 // starting the test itself: get to a known place.

	53 document.getElementById("e5").focus();

	54

	55 initTest(resultMap, finishJSTest);

	56 }

	57

	58 function runTest()

	59 {

	60 testParsingAndSerialization();

	61 testNavigation();

	62 }

	63 </script>

	64 </head>

	65 <style>

	66 #e2 {

	67 nav-left: #e4;

	68 }

	69 #e4 {

	70 nav-left: #e6;

	71 }

	72 #e5 {

	73 nav-right: #e9;

	74 nav-up: #e2;

	75 }

	76 #e6 {

	77 nav-down: #e8 current;

	78 }

	79 #e8 {

	80 nav-down: #fr1 "current";

	81 }

	82 #e9 {

	83 nav-up: #e9;

	84 nav-right: #e5;

	85 }

	86 </style>

	87 <body id="some-content" onload="runTest();">

	88 <p id="description">

	89 This test ensures the correctness of Spatial Navigation when CSS3 nav-up/down/le ft/right properties are set.

	90 </p>

	91 <table style="text-align: left; width: 100%; margin-left: auto; margin-right: au to;" border="1" cellpadding="2" cellspacing="1">

	92 <tbody>

	93 <tr>

	94 <td style="vertical-align: top; text-align: center;"><a id="e1" href="a">1</a></ td>

	95 <td style="vertical-align: top; text-align: center;"><a id="e2" href="a">2</a></ td>

	96 <td style="vertical-align: top; text-align: center;"><a id="e3" href="a">3</a></ td>

	97 </tr>

	98 <tr>

	99 <td style="vertical-align: top; text-align: center;"><a id="e4" href="a">4</a></ td>

	100 <td style="vertical-align: top; text-align: center;"><a id="e5" href="5">5</td>

	101 <td style="vertical-align: top; text-align: center;"><a id="e6" href="a">6</a></ td>

	102 </tr>

	103 <tr>

	104 <td style="vertical-align: top; text-align: center;"><a id="e7" href="a">7</a></ td>

	105 <td style="vertical-align: top; text-align: center;"><a id="e8" href="a">8</a></ td>

	106 <td style="vertical-align: top; text-align: center;"><a id="e9" href="a">9</a></ td>

	107 </tr>

	108 </tbody>

	109 </table>

	110 <br/>

	111 <iframe name="current" srcdoc="<button id='fr1' style='nav-down: #e5 root;'>insi de frame</button>" style="width:100%; height:40px"></iframe>

	112 <div id="console"></div>

	113 </body>

	114 </html>

OLD	NEW

« no previous file with comments | « no previous file | LayoutTests/fast/spatial-navigation/snav-css-nav-direction-expected.txt » ('j') | Source/core/css/CSSComputedStyleDeclaration.cpp » ('J')