Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@lydell

lydell/base64.css

Created September 4, 2016 09:47
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lydell/3c3375e7a9dc1265fe71474a9e098077 to your computer and use it in GitHub Desktop.
Save lydell/3c3375e7a9dc1265fe71474a9e098077 to your computer and use it in GitHub Desktop.
Download ZIP
Embedded source map support test
Raw
base64.css
.base64 { font-weight: bold; }
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IkFBQUEiLCJzb3VyY2VzIjpbInN1Y2Nlc3MuY3NzIl0sIm5hbWVzIjpbXX0= */
Raw
encodeURIComponent.css
.encodeURIComponent { font-weight: bold; }
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22mappings%22%3A%22AAAA%22%2C%22sources%22%3A%5B%22success.css%22%5D%2C%22names%22%3A%5B%5D%7D */
Raw
nothing.css
.nothing { font-weight: bold; }
/*# sourceMappingURL=data:application/json,{"version":3,"mappings":"AAAA","sources":["success.css"],"names":[]} */
Raw
success.css
.success { content: 'Test passed!' }
Raw
test.html
<!doctype html>
<meta charset="utf-8">
<title>Source map data:uri without base64 test</title>
<link rel="stylesheet" href="base64.css">
<link rel="stylesheet" href="encodeURIComponent.css">
<link rel="stylesheet" href="nothing.css">
<p>This is a test to see how your browser supports source maps embedded as data URIs.
<p>For each bold block of code below, right-click it and choose "Inspect element" and check which filename the inspector reports:
<ul>
<li>success.css: Your browser <em>does</em> support that test case!
<li>Anything else: Your browser does <em>not</em> support that test case.
</ul>
<pre class="base64">btoa('{"version":3,"mappings":"AAAA","sources":["success.css"],"names":[]}')</pre>
<pre class="encodeURIComponent">encodeURIComponent('{"version":3,"mappings":"AAAA","sources":["success.css"],"names":[]}')</pre>
<pre class="nothing">'{"version":3,"mappings":"AAAA","sources":["success.css"],"names":[]}'</pre>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment