summaryrefslogtreecommitdiffstats
path: root/dom/security/test/csp/test_svg_inline_style.html
blob: c05ca2046712d5ac7f91d0cb99527893660225b1 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE HTML>
<html>
<head>
  <title>Bug 1262842: Test CSP inline style within svg image</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script src="/tests/SimpleTest/WindowSnapshot.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<iframe id="img_base"></iframe>
<iframe id="img_csp"></iframe>
<iframe id="img_base_srcset"></iframe>
<iframe id="img_csp_srcset"></iframe>
<iframe id="doc_base"></iframe>
<iframe id="doc_csp"></iframe>

<script class="testbody" type="text/javascript">

// Description of the two tests:
//  * CSP should not apply to SVGs loaded as images (in src or srcset)
//  * CSP should apply to SVGs loaded as document
// Since we have to test inline styles within SVGs, we loaded the SVGs
// and then take screenshots to comopare that the two SVGs are identical.

SimpleTest.waitForExplicitFinish();

let img_base = document.getElementById("img_base");
let img_csp = document.getElementById("img_csp");
let img_base_srcset = document.getElementById("img_base_srcset");
let img_csp_srcset = document.getElementById("img_csp_srcset");
let doc_base = document.getElementById("doc_base");
let doc_csp = document.getElementById("doc_csp");

let loadedFrames = 0;

async function compareSVGs() {
  loadedFrames++;
  if (loadedFrames != 6) {
    return;
  }
  // compare the two iframes where SVGs are loaded as images
  try {
    let img_base_snap = await snapshotWindow(img_base.contentWindow);
    let img_csp_snap = await snapshotWindow(img_csp.contentWindow);

    ok(compareSnapshots(img_base_snap, img_csp_snap, true)[0],
       "CSP should not apply to SVG loaded as image");
  } catch(err) {
    ok(false, "img error: " + err.message);
  }

  // compare the two iframes where SVGs are loaded as images with srcset
  try {
    let img_base_snap_srcset = await snapshotWindow(img_base_srcset.contentWindow);
    let img_csp_snap_srcset = await snapshotWindow(img_csp_srcset.contentWindow);

    ok(compareSnapshots(img_base_snap_srcset, img_csp_snap_srcset, true)[0],
       "CSP should not apply to SVG loaded as image with srcset");
  } catch(err) {
    ok(false, "img error: " + err.message);
  }

  // compare the two iframes where SVGs are loaded as documents
  try {
    let doc_base_snap = await snapshotWindow(doc_base.contentWindow);
    let doc_csp_snap = await snapshotWindow(doc_csp.contentWindow);

    ok(compareSnapshots(doc_base_snap, doc_csp_snap, true)[0],
       "CSP should apply to SVG loaded as document");
  } catch(err) {
    ok(false, "doc error: " + err.message);
  }

  SimpleTest.finish();
}

// load SVG as images
img_base.onerror = function() {
  ok(false, "sanity: img_base onerror should not fire");
}
img_base.onload = function() {
  ok(true, "sanity: img_base onload should fire");
  compareSVGs();
}
img_base.src = "file_svg_inline_style_base.html";

img_csp.onerror = function() {
  ok(false, "sanity: img_csp onerror should not fire");
}
img_csp.onload = function() {
  ok(true, "sanity: img_csp onload should fire");
  compareSVGs();
}
img_csp.src = "file_svg_inline_style_csp.html";

img_base_srcset.onerror = function() {
  ok(false, "sanity: img_base_srcset onerror should not fire");
}
img_base_srcset.onload = function() {
  ok(true, "sanity: img_base_srcset onload should fire");
  compareSVGs();
}
img_base_srcset.src = "file_svg_srcset_inline_style_base.html";

img_csp_srcset.onerror = function() {
  ok(false, "sanity: img_csp_srcset onerror should not fire");
}
img_csp_srcset.onload = function() {
  ok(true, "sanity: img_csp_srcset onload should fire");
  compareSVGs();
}
img_csp_srcset.src = "file_svg_srcset_inline_style_csp.html";

// load SVG as documnents
doc_base.onerror = function() {
  ok(false, "sanity: doc_base onerror should not fire");
}
doc_base.onload = function() {
  ok(true, "sanity: doc_base onload should fire");
  compareSVGs();
}
doc_base.src = "file_svg_inline_style_server.sjs?svg_no_inline_style&5";

doc_csp.onerror = function() {
  ok(false, "sanity: doc_csp onerror should not fire");
}
doc_csp.onload = function() {
  ok(true, "sanity: doc_csp onload should fire");
  compareSVGs();
}
doc_csp.src = "file_svg_inline_style_server.sjs?svg_inline_style_csp&6";

</script>
</body>
</html>