Skip to content

Instantly share code, notes, and snippets.

@bhauman
Last active October 20, 2015 01:00
Show Gist options
  • Save bhauman/45800fc1fc7dd8e1199e to your computer and use it in GitHub Desktop.
Save bhauman/45800fc1fc7dd8e1199e to your computer and use it in GitHub Desktop.
Dynamic source map test
<html>
<head>
<script src="modifyme.js"></script>
</head>
<body>
<h1>Testing source map reloading.</h1>
<h3>Open Dev Tools and look in the console.</h3>
<p>Execute the <code>test_sm()</code> function and follow the source links.</p>
</body>
</html>
# Testing source map reloading
# autoreloading
# when this file loads the first time it will start reloading itself
# over and over every second
unless window.reload_file
console.log "Execute the test_sm() function and follow the source links."
setInterval (-> reload_file("modifyme.js?rel=" + (new Date().getTime()))), 1000
window.reload_file = (path) ->
x = document.createElement "script"
x.setAttribute "src", path
document.body.appendChild x
# just can't stand to not clean this up :)
setTimeout (-> document.body.removeChild(x)), 1000
# install coffeescript -- ie. npm install coffeescript
#
# compile this file with
# $ coffee -mcw modifyme.coffee
#
# That will watch and recompile the file and it's source maps as you
# edit and save this file
#
# load the index.html file into Chrome from the file system
#
# Open the DevTools console and run window.test_sm()
# and follow the source links for the log and error statements
# and see that they work
#
# Now modify the file by adding random blank lines in between the
# different functions defined below. Save the file after modifying it.
# !!! The new modifyme.js will get loaded into the browser automatically. !!!
# Do not refresh the browser by hand.
#
# Then execute the window.test_sm() function in the DevTools console
# and check the source path links.
window.test_sm = -> b()
b = -> c()
c = -> d()
d = ->
console.log "click the source link -> \n
Click the source link for the error below. \n
Also open the stack trace and click the source links for the different trace points."
e()
e = -> f()
f = -> g()
g = -> h()
h = -> i()
i = -> DoesntExist.yep()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment