Using Testacular with Jasmine to run tests on Chrome. I don't see any output other than "Executed 3 of 3 tests Succeeded". How can I get testacular to show which tests are being run, and/or a progress bar?
// Testacular configuration
// Generated on Tue Mar 05 2013 11:12:54 GMT-0600 (Central Standard Time)
// base path, that will be used to resolve files and exclude
basePath = '';
port = 9876;
runnerPort = 9100;
singleRun = false;
autoWatch = true;
captureTimeout = 60000;
colors = true;
logLevel = LOG_ERROR;
loggers: [{type: 'console'}];
reporters:['progress'];
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
browsers = ['Chrome'];
// list of files / patterns to load in the browser
files = [
JASMINE,
JASMINE_ADAPTER,
'../js/vendor/lodash.js',
'../js/vendor/angular-1.0.2/angular.js',
'../js/vendor/angular-1.0.2/angular-resource.js',
'../js/vendor/angular-1.0.2/angular-mocks.js',
'../js/vendor/angular-ui.js',
'../js/vendor/angular-strap.js',
'../js/objects/Route.js',
'../js/config.js',
'../js/objects.js',
'../js/app.js',
'../js/services.js',
'unit/**/*.js'
];
// list of files to exclude
exclude = [];
Related
ExtJs 6.2.0 does not work on Firefox if the screen is touch enabled. I noticed the problem using the classic version of the framework, I cannot tell if the modern version is also affected.
This is the exact problem: If the screen is touch enabled, it is possible to use the application with gestures, but not with the mouse. The mouse click does not fire the click events.
There is a mention of this problem on Sencha forum, but what is very frustrating is that Sencha fixes the problem for subscribers, but does not release a new GPL version. There is also a code snippet, but it was not quite clear to me how to use it:
// Undo sencha's logic
// Needed for top nav buttons to not open links in new tabs/windows when clicked in IE11 EXTJS-13775
// Firefox 52 is getting deteceted now as ALWAYS having pointer events
// chromeOS causing issues too
// unit tests failing
if (Ext.isIE || Ext.isEdge || (Ext.firefoxVersion >= 52) || Ext.os.is.ChromeOS || window.inUnitTest) {
// sorry windows mobile phones...
var eventMap = Ext.dom.Element.prototype.eventMap;
eventMap.click = 'click';
eventMap.dblclick = 'dblclick';
}
After some trial and error, and comparing console.logs and rifling in the code, I came up with an override that fixes the bug.
/**
* workaround for bug in ExtJs 6.2.0.
* Resolved in current yet unreleased version
*/
Ext.define('Mb.override.dom.Element', {
override: 'Ext.dom.Element'
},
function(){
var additiveEvents = this.prototype.additiveEvents,
eventMap = this.prototype.eventMap;
if(Ext.supports.TouchEvents && Ext.firefoxVersion >= 52 && Ext.os.is.Desktop){
eventMap['touchstart'] = 'mousedown';
eventMap['touchmove'] = 'mousemove';
eventMap['touchend'] = 'mouseup';
eventMap['touchcancel'] = 'mouseup';
eventMap['click'] = 'click';
eventMap['dblclick'] = 'dblclick';
additiveEvents['mousedown'] = 'mousedown';
additiveEvents['mousemove'] = 'mousemove';
additiveEvents['mouseup'] = 'mouseup';
additiveEvents['touchstart'] = 'touchstart';
additiveEvents['touchmove'] = 'touchmove';
additiveEvents['touchend'] = 'touchend';
additiveEvents['touchcancel'] = 'touchcancel';
additiveEvents['pointerdown'] = 'mousedown';
additiveEvents['pointermove'] = 'mousemove';
additiveEvents['pointerup'] = 'mouseup';
additiveEvents['pointercancel'] = 'mouseup';
}
})
I didn't test if every event translation combination is working. The lines needed especially for click event fired by the mouse with a touchscreen are
eventMap['click'] = 'click';
eventMap['dblclick'] = 'dblclick';
It's a known issue. See our site compatibility note for details:
https://www.fxsitecompat.com/en-CA/docs/2016/touch-event-support-has-been-re-enabled-on-windows-desktop/
I have just tried Optimizely. The problem is it will show different variations to a user. Sometimes we don't expect this behaviour. For example if I change color to red from blue, Optimizely will randomly select between the orginal (blue) and the variation (red) for the same user which is inconsistent. How can I make Optimizely to always show the same variation to a user?
Place the following code in your Experiment JavaScript:
setCookie = function (c_name,value,exdays) {
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var expires = exdate.toUTCString();
var isIE8 = (document.documentMode !== undefined);
if (exdays == 0) {
expires = (isIE8 == true) ? "" : "0";
}
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+expires);
document.cookie=c_name + "=" + c_value;
}
Within each variant (e.g. Blue Variant, Red Variant, etc.), call setCookie and check whether the cookie exists for a user in that particular variant. If the cookie does exist, then run whatever code you want that particular variant to run. Below is an example of setting a cookie called tester that will expire after 30 days.
setCookie('tester',true,30);
if(document.cookie.indexOf('tester')>-1){
//RUN YOUR CODE HERE IF THIS VISITOR HAS THIS COOKIE
}
Hi there I am an engineer at Optimizely,
You could alternatively try the Fullstack product, which is more developer-oriented. With this you get an SDK that you install with your bundle and you implement your testing logic using code.
Example:
npm install optimizely-client-sdk
const optimizely = require('optimizely-client-sdk');
const optimizelyClient = optimizely.createInstance({
datafile: {} // this is your experiment config which you get from the Optimizely UI
});
const variation = optimizelyClient.activate('color_experiment', 'user_1');
if (variation === 'blue') {
// do something for blue
} else if (variation === 'red') {
// do something for red
} else {
// default case
}
And as long as you pass in the exact same user_id as the second argument to activate, you are guaranteed to always get the same variation for that user.
For more information or details on getting started please take a look at: https://developers.optimizely.com/x/solutions/sdks/getting-started/index.html?language=javascript
Also keep in mind that Optimizely gets blocked by adblockers, it can happen if a user turns their adblocker on after they've been on the page and served up an experiment to see - they would get the original version.
Having an issue with Firefox 46, on all the other browsers it work fine.
Upon exit from the page I ask the following question. Firefox ignores it completely.
Help please!
window.onbeforeunload = ThisCheckExittingPage;
var ThisCheckExitWindow = 1;
// Checks before exitting
// ThisCheckExitWindow = 1;
// Does NOT check before exitting
// ThisCheckExitWindow = 0;
function ThisCheckExittingPage() {
if (ThisCheckExitWindow == 1)
{
return "You are about to exit this page.";
}
}
This looks like by design, as WindowEventHandlers.onbeforeunload - Web APIs | MDN has this note:
To combat unwanted pop-ups, browsers may not display prompts created
in beforeunload event handlers unless the page has been interacted
with. Firefox has implemented this policy since Firefox 44 (Bugzilla).
As the relevant patch shows, the mUserHasInteracted flag variable is set after a mouse or keyboard event happens in the window.
I am trying to create an ultimate gulpfile that we can use on one of our big sites (one with multiple themes depending on the section of the site you are in). I'm trying to get it to only run the process it needs to run and not recompile everything.
Let me layout exactly what i'm trying to achieve:
Folder Structure
src/
master-theme/
css/
style.scss
partials/
_a.scss
_b.scss
img/
a.jpg
b.jpg
sub-theme/
css/
style.scss
partials/
_c.scss
_d.scss
img/
c.png
d.jpg
I want these files to be compressed/compiled and to end up in the destination folder with the same folder structure (just replace src with dest in your mind)
The Problem
At the moment i can get it to do what I want - but the gulpfile compiles and compresses everything. E.g. if I add an image tosub-theme/img it will run the image compression for all the "themes". I am using gulp-changed but it still means that it is looking at all the images accross the site.
The same is also for the sass - if I update _c.scss, but the master css and the sub-theme css get compiled which is obviously not desired.
Current Solution
I don't really have one at the moment. Right now I am using gulp-file-tree to generate a json file of the folder structure, then whenever a file is changed, looping through that
with a function (which I know is horrible - but a solution which currently works)
var tree = require('./build/tree.json');
var children = tree.children;
for (var i = children.length - 1; i >= 0; i--) {
var child = children[i];
if(child.isDirectory)
task(child)
}
There task() is a gulp tasks passed in (e.g. Sass compilation)
The folder structure is not up for discussion - I don't want this to turn into a 'structure your files differently' kind of thing. There are several other factors involved which are not related to this issue as to why we are this way (Sorry I had to say that...)
I'm open to trying anything as i've stared at this file for days now.The tasks I am trying to run are:
Sass compilation
Sprite generation
SVG sprite to PNG sprite
Image compression
Javascript compression
Thanks in advance for your help. If a solution is found, I'll write a proper post about it so that others will hopefully not feel my pain...
I'm doing pretty much the same thing, and I think I've nailed it.
gulpfile.js:
var gulp = require('gulp'),
debug = require('gulp-debug'),
merge = require('merge-stream'),
sass = require('gulp-sass'),
less = require('gulp-less'),
changed = require('gulp-changed'),
imagemin = require('gulp-imagemin'),
prefix = require('gulp-autoprefixer'),
minifyCSS = require('gulp-minify-css'),
browserSync = require('browser-sync'),
reload = browserSync.reload,
path = require('path'),
glob = require('glob');
// Log errors to the console
function errorHandler(error) {
console.log(error.toString());
this.emit('end');
}
function processThemeFolder(src) {
function debugTheme(type) {
return debug({ title: 'theme ' + theme + ' ' + type});
}
var theme = path.basename(src);
var dest = 'public/themes/' + theme;
return merge(
gulp
.src([src + '/sass/**/*.scss'])
.pipe(changed(dest + '/css', { extension: '.css' }))
.pipe(debugTheme('sass'))
.pipe(sass())
.pipe(minifyCSS())
.pipe(gulp.dest(dest + '/css')),
gulp
.src([src + '/less/**/*.less'])
.pipe(changed(dest + '/css', { extension: '.css' }))
.pipe(debugTheme('less'))
.pipe(less())
.pipe(minifyCSS())
.pipe(gulp.dest(dest + '/css')),
gulp
.src([src + '/js/**/*.js'])
.pipe(changed(dest + '/js'))
.pipe(debugTheme('js'))
.pipe(uglify())
.pipe(gulp.dest(dest + '/js')),
gulp
.src([src + '/img/**/*.{png,jpg,gif}'])
.pipe(changed(dest + '/img'))
.pipe(debugTheme('img'))
.pipe(imagemin())
.pipe(gulp.dest(dest + '/img'))
).on('change', reload);
}
gulp.task('themes', function() {
var srcThemes = glob.sync('resources/themes/*');
return merge(srcThemes.map(processThemeFolder));
});
// ...
The key here is to use gulp-changed to only pass through the changed files. The rest is cream on top.
The compilation streams all show a debug line detailing what files are going into the stream. On a change in the stream,
the browserSync is notified to reload the browsers, using streaming (if possible). The theme task is only completed once
all its compilation streams are done, and the over-all themes task will only be marked as done when all the themes are done.
The theme's source files are stored in resources/themes/themename, and writes its output to public/themes/themename.
This is working very well for me, YMMV. :-)
I would use the following plugin to manage a cache for your processed files. It will then use the cache and determine what needs to be changed and what has already been processed prior to this.
https://github.com/wearefractal/gulp-cached
HTH
You can create a function with parameters that compiles only the changed file then you can call another one that combines the result. For example generate a.css and b.css and when a.scss is updated only a.css should be updated. After each call, trigger a combine function that puts a and b together. Google too see how you get the path of the changed file. Idon't remember which plugin I used
I'd like my add-on to restart Firefox and upon restart have a pre-defined webpage displayed.
When I restart the browser via nsIAppStartup.quit(), all of the tabs I had been viewing will be re-opened after restart. I have tried to cope with this manually by closing all the tabs before restarting (see code below), but I find that although I can visually confirm that all of the tabs are closed, they will be present again after a restart.
I assume that some session restore mechanism is re-creating them after the restart. I have found several preferences regarding "SessionStore" (browser.sessionstore.max_tabs_undo, browser.sessionstore.resume_from_crash, etc), but toggling them does not seem to help me resolve this issue.
How should I go about ensuring that the old tabs are closed after a restart? Thank you!
// get gBrowser reference
var mainWindow = Cc["#mozilla.org/appshell/window-mediator;1"].getService(Ci.nsIWindowMediator).getMostRecentWindow("navigator:browser");
var gBrowser = mainWindow.gBrowser;
// build a collection of tabs to close
var tabsToClose = [];
for( var i = 0; i < gBrowser.mTabContainer.childNodes.length - 1; i++ ){
tabsToClose.push( gBrowser.mTabContainer.childNodes[i] );
}
// Open homepage in new tab
gBrowser.addTab(DEFAULT_HOMEPAGE);
// Close all tabs except for homepage
for( var i = 0; i < tabsToClose.length; i++ ){
gBrowser.removeTab( tabsToClose[i] );
}
// restart browser
Cc["#mozilla.org/toolkit/app-startup;1"].getService(nsIAppStartup).quit(nsIAppStartup.eRestart | nsIAppStartup.eAttemptQuit);
I changed your code a bit and came up with this solution:
var Cc = Components.classes;
var Ci = Components.interfaces;
var pref = Cc["#mozilla.org/preferences-service;1"]
.getService(Components.interfaces.nsIPrefService);
pref.setBoolPref("browser.tabs.warnOnCloseOtherTabs",false);
var mainWindow = Cc["#mozilla.org/appshell/window-mediator;1"].getService(Ci.nsIWindowMediator).getMostRecentWindow("navigator:browser");
var gBrowser = mainWindow.gBrowser;
var newTab = gBrowser.addTab("www.google.com");
// Easier solution than having two loops to identify the open tabs
gBrowser.removeAllTabsBut(newTab);
var nsIAppStartup = Ci.nsIAppStartup; // You were missing this part on your question
Cc["#mozilla.org/toolkit/app-startup;1"].getService(nsIAppStartup).quit(nsIAppStartup.eRestart | nsIAppStartup.eAttemptQuit);
The preference that you need to change is browser.tabs.warnOnCloseOtherTabs so you don't get a warning when closing multiple tabs. The other sessionstore prefs i didn't touch.
Hope it helps.