How to debug inline javascript?

So, quick question: how do we debug inline Javascript code, included in the main page instead of an external script file?

The solution is quite easy; all you need to do is to add the following in the section you wish to debug:

<section class="video-overlay">
    <div class="video-wrapper">
        <a href="#" class="close"></a>
    </div>
</section>

<script>
    //# sourceURL=homescript.js
    var ctaSectionMobileDOM = $("#cta-section-mobile");
    var mobilePaymentOverlayDOM = $("#mobile-payment-overlay");
    var bxSliderInit = {};
    var bxSliderDesktopInit;

    $(document).ready(function(){

        $('#top-sports-slider').bxSlider({
            infiniteLoop:   false
            , speed:        250
            , oneToOneTouch: false

All the magic is on the //# sourceURL=homescript.js part. This will create a file instance in the sources, which you can handle as any other source files:

Enjoy your debugging!