Skip to content

Commit 014cd4b

Browse files
sherwinskisherwinski
committed
style: sync formatting fixes
1 parent 034ccf0 commit 014cd4b

3 files changed

Lines changed: 150 additions & 84 deletions

File tree

‎index.html‎

Lines changed: 103 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -20,24 +20,34 @@
2020
animation: slideIn 0.3s ease-out;
2121
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
2222
}
23-
* { box-sizing: border-box; }
23+
* {
24+
box-sizing: border-box;
25+
}
2426
body {
2527
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
2628
max-width: 720px;
2729
margin: 40px auto;
2830
padding: 0 20px;
2931
color: #1a1a2e;
3032
}
31-
h1 { font-size: 22px; margin-bottom: 4px; }
32-
.subtitle { color: #666; margin-bottom: 24px; }
33+
h1 {
34+
font-size: 22px;
35+
margin-bottom: 4px;
36+
}
37+
.subtitle {
38+
color: #666;
39+
margin-bottom: 24px;
40+
}
3341
.card {
3442
background: #f8f9fa;
3543
border: 1px solid #e0e0e0;
3644
border-radius: 10px;
3745
padding: 20px;
3846
margin-bottom: 16px;
3947
}
40-
.card h3 { margin-top: 0; }
48+
.card h3 {
49+
margin-top: 0;
50+
}
4151
button {
4252
padding: 10px 20px;
4353
font-size: 14px;
@@ -47,10 +57,20 @@
4757
margin-right: 8px;
4858
margin-bottom: 8px;
4959
}
50-
.btn-primary { background: #e63946; color: white; }
51-
.btn-primary:hover { background: #c1121f; }
52-
.btn-secondary { background: #457b9d; color: white; }
53-
.btn-secondary:hover { background: #1d3557; }
60+
.btn-primary {
61+
background: #e63946;
62+
color: white;
63+
}
64+
.btn-primary:hover {
65+
background: #c1121f;
66+
}
67+
.btn-secondary {
68+
background: #457b9d;
69+
color: white;
70+
}
71+
.btn-secondary:hover {
72+
background: #1d3557;
73+
}
5474
#log {
5575
background: #1a1a2e;
5676
color: #a8dadc;
@@ -63,22 +83,46 @@
6383
white-space: pre-wrap;
6484
word-break: break-all;
6585
}
66-
#log .error { color: #e63946; }
67-
#log .success { color: #2a9d8f; }
68-
#log .info { color: #e9c46a; }
69-
table { width: 100%; border-collapse: collapse; font-size: 14px; }
70-
td { padding: 6px 0; }
71-
td:first-child { font-weight: 600; width: 200px; }
86+
#log .error {
87+
color: #e63946;
88+
}
89+
#log .success {
90+
color: #2a9d8f;
91+
}
92+
#log .info {
93+
color: #e9c46a;
94+
}
95+
table {
96+
width: 100%;
97+
border-collapse: collapse;
98+
font-size: 14px;
99+
}
100+
td {
101+
padding: 6px 0;
102+
}
103+
td:first-child {
104+
font-weight: 600;
105+
width: 200px;
106+
}
72107
.tag {
73108
display: inline-block;
74109
padding: 2px 8px;
75110
border-radius: 4px;
76111
font-size: 12px;
77112
font-weight: 600;
78113
}
79-
.tag-legacy { background: #ffc9c9; color: #c92a2a; }
80-
.tag-vapid { background: #b2f2bb; color: #2b8a3e; }
81-
.tag-unknown { background: #e0e0e0; color: #666; }
114+
.tag-legacy {
115+
background: #ffc9c9;
116+
color: #c92a2a;
117+
}
118+
.tag-vapid {
119+
background: #b2f2bb;
120+
color: #2b8a3e;
121+
}
122+
.tag-unknown {
123+
background: #e0e0e0;
124+
color: #666;
125+
}
82126
</style>
83127
<script>
84128
// set can a query param ?app_id=your_app_id OR
@@ -104,18 +148,41 @@
104148
</head>
105149
<body>
106150
<h1>SDK-4180: Safari VAPID Push Test</h1>
107-
<p class="subtitle">Test page to verify Safari uses VAPID instead of legacy push for new users</p>
151+
<p class="subtitle">
152+
Test page to verify Safari uses VAPID instead of legacy push for new users
153+
</p>
108154

109155
<div class="card">
110156
<h3>Browser & Safari Push Info</h3>
111157
<table>
112-
<tr><td>User Agent</td><td id="ua">—</td></tr>
113-
<tr><td>window.safari exists</td><td id="safari-exists">—</td></tr>
114-
<tr><td>Legacy permission state</td><td id="legacy-perm">—</td></tr>
115-
<tr><td>Legacy deviceToken</td><td id="legacy-token">—</td></tr>
116-
<tr><td>Notification.permission</td><td id="notif-perm">—</td></tr>
117-
<tr><td>PushSubscriptionOptions</td><td id="vapid-support">—</td></tr>
118-
<tr><td>Expected push path</td><td id="push-path">—</td></tr>
158+
<tr>
159+
<td>User Agent</td>
160+
<td id="ua">—</td>
161+
</tr>
162+
<tr>
163+
<td>window.safari exists</td>
164+
<td id="safari-exists">—</td>
165+
</tr>
166+
<tr>
167+
<td>Legacy permission state</td>
168+
<td id="legacy-perm">—</td>
169+
</tr>
170+
<tr>
171+
<td>Legacy deviceToken</td>
172+
<td id="legacy-token">—</td>
173+
</tr>
174+
<tr>
175+
<td>Notification.permission</td>
176+
<td id="notif-perm">—</td>
177+
</tr>
178+
<tr>
179+
<td>PushSubscriptionOptions</td>
180+
<td id="vapid-support">—</td>
181+
</tr>
182+
<tr>
183+
<td>Expected push path</td>
184+
<td id="push-path">—</td>
185+
</tr>
119186
</table>
120187
</div>
121188

@@ -145,21 +212,26 @@ <h3>Log</h3>
145212
function refreshInfo() {
146213
$('ua').textContent = navigator.userAgent;
147214

148-
const hasSafari = typeof window.safari !== 'undefined' &&
215+
const hasSafari =
216+
typeof window.safari !== 'undefined' &&
149217
typeof window.safari.pushNotification !== 'undefined';
150218
$('safari-exists').textContent = hasSafari ? 'Yes' : 'No';
151219

152220
if (hasSafari) {
153221
try {
154-
const safariWebId = OneSignal?.config?.safariWebId || 'web.onesignal.auto.6187ce57-f346-4a86-93e4-7d70d494c000';
222+
const safariWebId =
223+
OneSignal?.config?.safariWebId ||
224+
'web.onesignal.auto.6187ce57-f346-4a86-93e4-7d70d494c000';
155225
const perm = window.safari.pushNotification.permission(safariWebId);
156226
$('legacy-perm').textContent = perm.permission;
157227
$('legacy-token').textContent = perm.deviceToken || '(null)';
158228

159229
if (perm.permission === 'granted' && perm.deviceToken) {
160-
$('push-path').innerHTML = '<span class="tag tag-legacy">Legacy Safari Push</span> (existing subscriber)';
230+
$('push-path').innerHTML =
231+
'<span class="tag tag-legacy">Legacy Safari Push</span> (existing subscriber)';
161232
} else {
162-
$('push-path').innerHTML = '<span class="tag tag-vapid">Standard VAPID Push</span> (new user)';
233+
$('push-path').innerHTML =
234+
'<span class="tag tag-vapid">Standard VAPID Push</span> (new user)';
163235
}
164236
} catch (e) {
165237
$('legacy-perm').textContent = 'Error: ' + e.message;
@@ -176,8 +248,8 @@ <h3>Log</h3>
176248

177249
const vapidSupport = typeof PushSubscriptionOptions !== 'undefined';
178250
$('vapid-support').textContent = vapidSupport ? 'Supported' : 'Not available';
179-
$('notif-perm').textContent = typeof Notification !== 'undefined'
180-
? Notification.permission : 'N/A';
251+
$('notif-perm').textContent =
252+
typeof Notification !== 'undefined' ? Notification.permission : 'N/A';
181253
}
182254

183255
$('request-perm').addEventListener('click', async () => {

0 commit comments

Comments
 (0)