blob: 1272136d138ee4221047964f6283adf90f0a9c90 [file] [log] [blame]
Copybara botbe50d492023-11-30 00:16:42 +01001<!DOCTYPE html>
2<html>
3<meta charset='utf-8'>
4<head>
5<script src="../dist/dialog-polyfill.js"></script>
6<link rel="stylesheet" type="text/css" href="../dist/dialog-polyfill.css">
7<style>
8dialog {
9 display: none;
10 height: 50px;
11 width: 50px;
12 padding: 0;
13 margin: 0;
14}
15
16dialog.left {
17 top: 100px;
18 left: 100px;
19}
20
21#middle {
22 top: 100px;
23 left: 200px;
24}
25</style>
26</head>
27<body>
28<p>Test that dialogs with an explicit static position don't get auto-centered.
29The test passes if there are three boxes aligned in a single row.</p>
30<div id="console"></div>
31<dialog id="left" class="left"></dialog>
32<dialog id="middle"></dialog>
33<dialog id="right"></dialog>
34<script>
35function writeToConsole(s) {
36 var console = document.getElementById('console');
37 var span = document.createElement('span');
38 span.textContent = s;
39 console.appendChild(span);
40 console.appendChild(document.createElement('br'));
41}
42
43var dialogs = document.querySelectorAll('dialog');
44for (var i = 0; i < dialogs.length; ++i)
45 dialogPolyfill.registerDialog(dialogs[i]);
46
47var leftDialog = document.getElementById('left');
48leftDialog.show();
49
50var middleDialog = document.getElementById('middle');
51middleDialog.show();
52
53var rightDialog = document.getElementById('right');
54rightDialog.style.top = '100px';
55rightDialog.style.left = '300px';
56rightDialog.show();
57</script>
58</body>
59</html>