Otwarte Karma strona debug.html na starcie

Question

Wersja krótka:

Jak mogę uruchomić Karma i go automatycznie otworzyć plik debug.html w tej samej przeglądarce, jak rozpocząć Karma stronę?

Długa wersja:

Nie jestem wielkim fanem używając dziennikarzom konsoli do karmy, więc używam karma-jasmine-html-reporter-livereload które wysyła sygnał do localhost: 9876 Karma w pliku/debug.html. Problem polega na tym, że za każdym razem, gdy rozpoczynam sesję debugowania, muszę kliknąć przycisk "debugowanie" na stronie internetowej, która otwiera karmę.

Chciałbym znaleźć sposób na to, aby karma otworzyła stronę debug.html automatycznie poprzez zadanie "gulp". Przeprowadzam testy w wielu przeglądarkach, dlatego chciałbym otworzyć stronę debug.html jako drugą kartę w każdej przeglądarce, którą otwiera Karma. Chciałbym również móc zamknąć tę kartę debug.html, gdy karma się zamyka. Próbowałem wielu rzeczy bez powodzenia.

Oto moje zadanie z trudem. Zadanie "obserwuj" obserwuje moje pliki źródłowe TypeScript i kompiluje je w javascript ... nic nadzwyczajnego.

gulp.task('watch-test', ['watch'], function (done) { 
    //start a livereload server so that the karma html 
    //reporter knows to reload whenever the scripts change 
    livereload.listen(35729); 
    gulp.watch('dist/src/**/*.js').on('change', livereload.changed); 

    new KarmaServer({ 
     configFile: __dirname + '/karma.conf.js', 
     singleRun: false 
    }, done).start(); 
}); 

Answer 1

znalazłem sposób, który sprawia, że ​​jest trwały, choć nie jest idealny .. Można wstrzyknąć w kontekście javascript:

files: [ 
    "test/init.js", 
    ... 
] 

i umieścić wewnątrz pliku ten kod:

(function (window) { 
    if (!window.parent.initDone && window.location.pathname === '/context.html') { 
     window.parent.initDone = true; 
     window.open('/debug.html', '_blank'); 
    } 
})(window) 

to zapewni, że okno będzie otwarte tylko przy pierwszym uruchomieniu testów i zostanie wykonane tylko w context.html.

Możesz dodać dowolny kod inicjujący wewnątrz tego bloku.

Answer 2

nie mogłem zorientować się elegancki sposób to zrobić, więc tu jest brudne, low-down, nie-dobre, zgniłe, całkowicie haniebne oszustwo, ale to działa. :)

W node_modules> karmy> statycznych> karma.js I dodaje następujące linie:

var debugWin = window.open('http://localhost:7676/debug.html','Debugme'); 
debugWin.focus(); 

przedstawiono poniżej w kontekście, począwszy od około linii 366 (w wersji 0.13.19):

var updateBanner = function (status) { 
    return function (param) { 
     var paramStatus = param ? status.replace('$', param) : status 
     titleElement.innerHTML = 'Karma v' + VERSION + ' - ' + paramStatus 
     bannerElement.className = status === 'connected' ? 'online' : 'offline' 
    } 
    } 

    var debugWin = window.open('http://localhost:7676/debug.html','Debugme'); 
    debugWin.focus(); 

    socket.on('connect', updateBanner('connected')) 
    socket.on('disconnect', updateBanner('disconnected')) 
    socket.on('reconnecting', updateBanner('reconnecting in $ ms...')) 
    socket.on('reconnect', updateBanner('connected')) 
    socket.on('reconnect_failed', updateBanner('failed to reconnect')) 
    socket.on('info', updateBrowsersInfo) 
    socket.on('disconnect', function() { 
    updateBrowsersInfo([]) 
    }) 
} 

Ciesz się. Buntujesz się, ty.

Answer 3

Można użyć definicji customLauncher Przeglądarka:

customLaunchers: { 
    ChromeDebugging: { 
     base: 'Chrome', 
     flags: [ '--remote-debugging-port=9333', '--auto-open-devtools-for-tabs', 'http://localhost:9876/debug.html' ] 
    } 
    } 

i używać tej przeglądarki w swojej karmy config.