LayoutTests/fast/multicol/orphans-relayout.html - Issue 299373006: Move old multicol tests to a separate directory.

Side by Side Diff: LayoutTests/fast/multicol/orphans-relayout.html

Issue 299373006: Move old multicol tests to a separate directory. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master

Patch Set: Created 6 years, 7 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 <style>

6 body.hide-containers .container {

7 display: none;

8 }

9

10 .container {

11 width: 600px;

12 height: 200px;

13 -webkit-columns: 3;

14 columns: 3;

15 column-fill: auto;

16 line-height: 20px; /* 10 lines per page */

17 font-size: 16px;

18 margin: 0 0 20px 0;

19 padding: 0;

20 overflow: hidden;

21 orphans: 2;

22 }

23

24 .block {

25 margin: 0 0 15px 0;

26 padding: 0;

27 }

28

29 .top {

30 color: red;

31 }

32

33 .bottom {

34 color: green;

35 }

36 </style>

37 <script>

38

39 description("Test if an element with orphans relayouts correctly. The red lines of text must be at the top of the blue rectangle. The green lines of text must b e at the bottom of the blue rectangle.");

40

41 if (window.testRunner)

42 testRunner.dumpAsText();

43

44 function testIsFirstInColumn(containerId, blockNumber, lineNumber)

45 {

46 // Get the upper bounds of the container and line.

47 var topOfContainer = document.getElementById(containerId).getBoundingClientR ect().top;

48 var topOfLine = document.getElementById(containerId + "-block-" + blockNumbe r + "-line-" + lineNumber).getBoundingClientRect().top;

49

50 if (Math.abs(topOfContainer - topOfLine) < 5) // Give 5 pixels to account fo r subpixel layout.

51 testPassed(containerId + " Block " + blockNumber + " Line " + lineNumber + " is correct.");

52 else

53 testFailed(containerId + " Block " + blockNumber + " Line " + lineNumber + " wasn't at the top of the region.");

54 }

55

56 function runTest()

57 {

58 var container = document.getElementById("test");

59

60 document.body.offsetTop;

61

62 container.style.border = "3px solid blue"; // Modify a property that trigger s a layout.

63

64 testIsFirstInColumn("test", 1, 1);

65 testIsFirstInColumn("test", 2, 1);

66

67 if (window.testRunner) {

68 // Hide all the containers and leave just the test results for text outp ut.

69 document.body.className = "hide-containers";

70 }

71

72 isSuccessfullyParsed();

73 }

74

75 window.addEventListener("load", runTest, false);

76 </script>

77 </head>

78 <body>

79 <div class="container" id="test">

80 <div class="block">

81 <span id="test-block-1-line-1" class="top">Block 1 Line 1</span><br>

82 <span id="test-block-1-line-2">Block 1 Line 2</span><br>

83 <span id="test-block-1-line-3">Block 1 Line 3</span><br>

84 <span id="test-block-1-line-4">Block 1 Line 4</span><br>

85 <span id="test-block-1-line-5">Block 1 Line 5</span><br>

86 <span id="test-block-1-line-6">Block 1 Line 6</span><br>

87 <span id="test-block-1-line-7">Block 1 Line 7</span><br>

88 <span id="test-block-1-line-8" class="bottom">Block 1 Line 8</span>< br>

89 </div>

90 <div class="block">

91 <span id="test-block-2-line-1" class="top">Block 2 Line 1</span><br>

92 <span id="test-block-2-line-2">Block 2 Line 2</span><br>

93 <span id="test-block-2-line-3">Block 2 Line 3</span><br>

94 <span id="test-block-2-line-4">Block 2 Line 4</span><br>

95 <span id="test-block-2-line-5">Block 2 Line 5</span><br>

96 <span id="test-block-2-line-6">Block 2 Line 6</span><br>

97 </div>

98 </div>

99 </body>

100 </html>

OLD	NEW