I'm trying to get my test integrated into bamboo. With bamboo, it seems that I need test results to be in junit xml format. Because of this, I need to get my "grunt jasmine" execution to output test results in xml format. I'm new to jasmine/grunt/junit and have spent more time than I care to admit trying to get this to work. I've followed various tutorials and boards (mostly https://gist.github.com/asabaylus/3059886), but am just stuck.
When I run "grunt jasmine" from gitbash, The specs run successfully, but no output file is produced and I get the following error...
" An error occurred while processing a template (Cannot call method 'indexO
f' of undefined). Use --force to continue.
Aborted due to warnings."
Do I have to change any other files? Can anyone please help me work through this?
Please and thanks!
CC
grunt.js file
/*global module:false*/
module.exports = function ( grunt ) {
// Project configuration.
grunt.initConfig({
meta: {
banner: '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - ' +
'<%= grunt.template.today("yyyy-mm-dd") %>\n' +
'<%= pkg.homepage ? "* " + pkg.homepage + "\n" : "" %>' +
'* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' +
' Licensed <%= _.pluck(pkg.licenses, "type").join(", ") %> */'
},
lint: {
files: ['grunt.js', 'src/**/*.js']
},
jasmine: {
all: ['./SpecRunner.html'],
junit: {
dest: 'test-results'
}
},
concat: {
dist: {
src : ['<banner:meta.banner>', '<file_strip_banner:src/buyitnow.js>'],
dest: 'dist/buyitnow/<%= meta.version %>/buyitnow.js'
}
},
min: {
dist: {
src : ['<banner:meta.banner>', '<config:concat.dist.dest>'],
dest: 'dist/buyitnow/<%= meta.version %>/buyitnow.min.js'
}
},
watch: {
files: '<config:lint.files>',
tasks: 'lint'
},
jshint: {
options: {
curly : true,
eqeqeq : true,
immed : true,
latedef: true,
newcap : true,
noarg : true,
sub : true,
undef : true,
boss : true,
eqnull : true,
browser: true,
jquery : true,
node : true
},
globals: {}
},
uglify: {}
});
grunt.loadNpmTasks('grunt-jasmine-task');
// Default task.
grunt.registerTask('default', 'lint jasmine concat min cssmin');};
My specrunner.html file
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Jasmine Spec Runner</title>
<link rel="shortcut icon" type="image/png" href="lib/jasmine-1.3.1/jasmine_favicon.png">
<link rel="stylesheet" type="text/css" href="lib/jasmine-1.3.1/jasmine.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine-html.js"></script>
<script type="text/javascript" src="lib/jasmine.async.min.js"></script>
<script type="text/javascript" src="lib/sinon-1.6.0.js"></script>
<!-- For JUnit output of test results include the following link to Lary Myer's JUnit reporter -->
<script type="text/javascript" src="node_modules/jasmine-reporters/src/jasmine.junit_reporter.js"></script>
<!-- include spec files here... -->
<script type="text/javascript" src="spec/binSpec.js"></script>
<script type="text/javascript">
(function() {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;
var htmlReporter = new jasmine.HtmlReporter();
jasmineEnv.addReporter(htmlReporter);
// Specify target test results folder as below, for now
var junitReporter = new jasmine.JUnitXmlReporter('test-results/');
jasmineEnv.addReporter(junitReporter);
jasmineEnv.specFilter = function(spec) {
return htmlReporter.specFilter(spec);
};
var currentWindowOnload = window.onload;
window.onload = function() {
if (currentWindowOnload) {
currentWindowOnload();
}
execJasmine();
};
function execJasmine() {
jasmineEnv.execute();
}
})();
</script>
</head>
<body>
</body>
</html>
As Amir T said, you can use grunt-contrib-jasmine. Moreover, grunt-jasmine-task is not longer active.
The options.junit.path option can be used for creating junit reports that can then be used by Jenkins/Hudson, Travis, Bamboo, etc. This option should provide the name of the folder where the reports are going to be created (grunt-contrib-jasmine will create an xml for each spec file). This is an example configuration:
jasmine: {
tests: {
src: 'dist/buyitnow/<%= meta.version %>/buyitnow.min.js',
options: {
specs: 'spec/*Spec.js',
junit: {
path: 'build/junit'
},
}
}
}
You don't need to create an SpecRunner.html file as it's created automatically by grunt-contrib-jasmine
I'm able to do this using grunt-contrib-jasmine#0.5.2
jasmine: {
pivotal: {
src: 'build/application.js',
options: {
specs: 'test/**/*_spec.js',
helpers: 'test/**/*_helper.js',
junit: {
path: 'build/.test'
},
}
}
}
Related
I'm designing for a project and it is saying this to my scenes and its just one blank screen that's white
when I check debug I get this:
Uncaught TypeError: Class extends value undefined is not a constructor or null
here is my index file
<!doctype html>
<html lang="en">
<head>
<title>save the mahanadi river, an energy project</title>
<!--libs-->
<script src="//cdn.jsdelivr.net/npm/phaser#3.24.1/dist/phaser.js"></script>
<!--project-->
<script type = "text/javascript" src = ".js/game.js"></script>
<!--scenes-->
<script type = "text/javascript" src = "scenes/boot.js"></script>
<script type = "text/javascript" src = "scenes/menu.js"></script>
</head>
<body>
<H1>hello for now</H1>
</body>
</html>
and my scene prob code
class Boot extends Phaser.scene {
constructor() {
super("Boot")
};
preload (){
};
create (){
this.add.text(20, 20, "welcome!")
};
update (){
};
};
here is my game.js
window.onload = function(){
var config = {
type: Phaser.AUTO,
width: 800,
height: 600,
physics: {
default: 'arcade',
arcade: {
gravity: { y: 300 },
debug: false
}
},
scene: {
preload: preload,
create: create,
update: update
}
};
var game = new Phaser.Game(config);
}
ok thanks photon storm but i still have bugs
my game.js
window.onload = function(){
var config = {
type: Phaser.AUTO,
width: 800,
height: 600,
Scenes: [Boot,Menu],
Scenes.push(Boot),
Scenes.push(Menu),
physics: {
default: 'arcade',
arcade: {
gravity: { y: 300 },
debug: false
}
},
};
var game = new Phaser.Game(config);
}
its giving probs at phaser.push
If you are going to use a class for your Scene, then you need to change your Game Config to reflect this. At the moment it's still using the old 3-function approach, but you need to tell it you're using a Scene class now:
scene: [ Boot ]
Where 'Boot' is your Boot Scene. Adding more Scenes? Append them to this array. The first one in the list is started automatically.
I try to plot 3 temperature series into a single highcharts chart.
The data comes from 3 seperate JSON files in the format:
[
[1567529940953,43.4],
[1567530001644,43.3],
[1567530062503,43.4],
[1567530123220,43.4],
[1567530184116,43.4]
]
Additionally the JSON file is periodically updated so I want the chart to update itself every time the JSON files change or every minute or so.
I looked into enablePolling and that works perfect.
I have tried a lot but or I have multiple series and no polling or I have a single series and polling....
The best I could do was:
<script type="text/javascript">
Highcharts.stockChart('container', {
chart: {
type: 'spline'
},
rangeSelector: {
selected: 2,
buttons: [{
type: 'hour',
count: 1,
text: '1h'
}, {
type: 'hour',
count: 12,
text: '12h'
}, {
type: 'all',
text: 'All'
}]
},
title: {
text: 'Live Data (Rows JSON)'
},
yAxis: {
min: 15,
max: 50,
startOnTick: false,
endOnTick: false
},
subtitle: {
text: 'Data input from a remote JSON file'
},
data: {
rowsURL: window.location.origin + '/chart/terrarium_basking.json',
firstRowAsNames: false,
enablePolling: true
}
});
</script>
I needed to use window.location.origin in order to get it to work on my website. Not sure why www.reptile-addict.nl/chart/terrarium_basking.json didn't work!?
If it helps the other JSON streams are terrarium_ambient.json and terrarium_ceiling.json
EDIT: Think I got it to work.. :)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Highstock Example</title>
<style type="text/css">
</style>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script src="https://code.highcharts.com/stock/modules/export-data.js"></script>
<div id="container" style="height: 400px; min-width: 310px"></div>
<script type="text/javascript">
var seriesOptions = [],
seriesCounter = 0,
names = ['basking','ambient','ceiling'];
/**
* Create the chart when all data is loaded
* #returns {undefined}
*/
function createChart() {
Highcharts.stockChart('container', {
series: seriesOptions
});
}
function getJsonData() {
$.each(names, function (i, name) {
path = window.location.origin + '/chart/terrarium_' + name + '.json';
$.getJSON(path, function (data) {
seriesOptions[i] = {
name: name,
data: data
};
// As we're loading the data asynchronously, we don't know what order it will arrive. So
// we keep a counter and create the chart when all the data is loaded.
seriesCounter += 1;
if (seriesCounter === names.length) {
createChart();
seriesCounter = 0;
}
});
});
}
getJsonData();
setInterval( function(){ getJsonData(); }, 60000);
</script>
</body>
</html>
I use Grunt to automate converting my jade files. For that I use this script:
jade: {
compile: {
options: {
client: false,
pretty: true
},
files: [{
cwd: "_/components/jade",
src: "**/*.jade",
dest: "_/html",
expand: true,
ext: ".html"
}]
}
}
I also have this watch script running:
watch: {
jade: {
files: ['_/components/jade/**/*.jade'],
tasks: ['jade']
}
}
This works fine. However, when I delete a jade file, the html file remains. Is there a way to make grunt delete the corresponding html files when I delete a jade file?
If I understood you correctly, if you delete foo.jade you also want to delete foo.html correct? Here's an complete example using grunt-contrib-clean and grunt-contrib-watch:
You start by watching all the files with .jade extension with grunt watch. When a watched file is modified in some way, a watch event is emitted. If the event is deleted, we take the file path, change the extension to .html, set it as the src value of the clean:jade task and run the task.
module.exports = function(grunt) {
grunt.initConfig({
clean: {
jade: {
src: null
}
},
watch: {
jade: {
files: ['*.jade'],
options: {
spawn: false
}
},
}
});
grunt.loadNpmTasks("grunt-contrib-watch");
grunt.loadNpmTasks("grunt-contrib-clean");
grunt.event.on('watch', function(action, filepath) {
if (action === "deleted") {
var file = filepath.slice(0, -5) + ".html";
grunt.config.set('clean.jade.src', [file]);
grunt.task.run("clean:jade");
}
});
};
For more information, see Using the watch event # grunt-contrib-watch. Note that spawn option must be false
If you need to dynamically modify your config, the spawn option must be disabled to keep the watch running under the same context.
You need grunt-contrib-clean. But this code clear all files of same type and make grunt slowly and require a specific config for every task. So often just use clean single time when grunt start:
module.exports = function (grunt){
grunt.initConfig({
pckg: grunt.file.readJSON('package.json'),
clean: { // Grun-contrib-clean tasks
jade: ["dist/*.html"],
all: ["dist"]
},
jade: {
dist: {
files: [{
expand: true,
cwd: 'src/templates',
src: ['**/*.jade'],
dest: 'dist',
filter: 'isFile',
ext: '.html'
}]
}
},
watch: {
jade: {
files: ['src/templates/**/*.jade'],
tasks: ['clean:jade','jade']
},
}
});
require('load-grunt-tasks')(grunt);
grunt.registerTask('default', ['clean:all', 'jade', 'watch']);
};
I got stuck with the http get method which is used to get the json data.
The http get method is working fine it is actually fetching the json data, but I'm not able to connect it with the object literal.
To explain clearly here is the piece of code where I'm stuck.
var x ={};
$http.get('chart.json') //reading the studentRecord.json file
.success
(function(data1){
//alert(data1);
$scope.x = data1;
});
var conversionChart = new FusionCharts({
type: 'funnel',
renderAt: 'chart-container',
width: "100%",
dataFormat: 'json',
dataSource: x
});
I'm trying to apply the http.get method to the dataSource:to fetch the json data to it but, its not working. And my main task is to apply the http.get request to the dataSource:which makes my code work properly.
And let me give you the entire piece of code to understand better.
index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>FusionCharts - Funnel 3D Chart</title>
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<script data-require="angular.js#1.4.0-beta.6" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
<script type='text/javascript' src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script type='text/javascript' src="http://static.fusioncharts.com/code/latest/fusioncharts.widgets.js"></script>
<script type='text/javascript' src='/js/lib/dummy.js'></script>
<script type='text/javascript' src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="myApp">
<!-- A funnel 3D Chart showing a conversion analysis in percentage of visiting to purchase in Harry's Supermart website last year
Attribute :
# showPercentValues - set to 1 to show the values in percentage.
-->
<div id="chart-container" ng-controller="ParentCtrl" ng-init='load()' ng-model="dataSource1">FusionCharts will render here</div>
</body>
</html>
script.js
var myApp = angular.module("myApp", []);
//The below code will read the data from student.json file and will pass to the $scope variable
myApp.controller("ParentCtrl", function($scope, $http)
{
$scope.load = function(){
//alert("2");
FusionCharts.ready(function () {
//alert("1");
var conversionChart = new FusionCharts({
type: 'funnel',
renderAt: 'chart-container',
width: "100%",
dataFormat: 'json',
dataSource : function(){
$http.get('chart.json') //reading the studentRecord.json file
.success
(function(data1){
alert(data1);
$scope.dataSource = data1;// binding the data to the $scope variable
});
}
});
conversionChart.render();
});
};
});
chart.json
{
"chart": {
"caption": "Ensource sales report",
"subcaption": "Purchase - Conversion analysis for last year",
"decimals": "1",
"isHollow": "0",
"isSliced": "1",
"labelDistance": "15",
"plotTooltext": "Success : $percentOfPrevValue",
"theme": "fint",
"baseFontSize":"18"
},
"data":
[
{
"label": "Total",
"value": "385634"
},
{
"label": "Contacts",
"value": "175631"
},
{
"label": "Leads",
"value": "84564"
},
{
"label": "Sanctioned",
"value": "35654"
},
{
"label": "Disbursed",
"value": "12342"
}
]
}
My main intention is to use the http.get method to fetch the json data to
dataSource :
Plunker:http://plnkr.co/edit/HUKvROQv8wIiFfx6uZBk?p=preview
I'll be very thankfull if somebody help me with this .Plz help me because I'm new bee to angular
Based on your plunker, the code should be:
var myApp = angular.module("myApp", []);
//The below code will read the data from student.json file and will pass to the $scope variable
myApp.controller("ParentCtrl", function($scope, $http)
{
$scope.load = function(){
//alert("2");
FusionCharts.ready(function () {
//alert("1");
var conversionChart;
$http.get('chart.json') //reading the studentRecord.json file
.success
(function(data1){
//alert(data1);
$scope.dataSource = data1;// binding the data to the $scope variable
conversionChart = new FusionCharts({
type: 'funnel',
renderAt: 'chart-container',
width: "100%",
dataFormat: 'json',
dataSource : $scope.dataSource
});
conversionChart.render();
});
});
};
});
I need to select an element from my data with my $resource, but I have this error :
"Error: $produit1 is not defined GET XHR
http://localhost:8080/Jquery/data/produits.json/1 [HTTP/1.1 404
Introuvable 15ms]
I Think the problem comes from this url: http://localhost:8080/Jquery/data/produits.json/1
because this url http://localhost:8080/Jquery/data/produits.json is OK when i put it on my browser i can see the data, the first dont show me the data (Etat HTTP 404 - /Jquery/data/produits.json/1 )
[
{
"id" : 1,
"reference": "AAA",
},
{
"id" : 2,
"reference": "BBB",
}
]
How can I call my elements by the url please ?
Here is my code :
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Angular ngResource</title>
<script src= "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-resource.min.js"></script>
<script>
var myApp = angular.module('myApp', ['ngResource']);
myApp.factory('Produits',['$resource', function ($resource) {
return $resource('data/produits.json/:id',{id: "#id"},
{
'update': {method: 'PUT'},
'reviews': {method: 'GET'}
}
);
}]);
myApp.controller('produitsCtrl', function($scope, $http,Produits,$log) {
$scope.produits= Produits.query();
$scope.produit1 = Produits.get({'id': 1});
});
</script>
</head>
<body>
<div ng-app="myApp" >
<div ng-controller="produitsCtrl">
Reference 1 : {{ produit1.reference }}
</div>
</div>
</body>
</html>
The thing is that your call :
$resource('data/produits.json/:id',{id: "#id"},
is looking for a json that is generated regarding the id you pass. So your app expects to have a json file that exists only if in your route id=1 exists and returns a json.
$scope.produit1 = Produits.get({'id': 1});
should return a json file with elements as the ones you have currently.
If you want to use the datas contained in your json you need to do this :
var Produits = $resource(data/produits.json);
myApp.controller('produitsCtrl', function($scope, $http,Produits,$log) {
var upd = {
"id": 1,
"reference": "REF"
}
Produits.$update(upd.id);
});