I have a asp.net mvc app . In Scripts I have the subfolder app containing Controller.js. I also have another subfolder Spec containint ControllerSpec.js - written with jasmine.
describe('PhoneCat controllers', function () {
beforeEach(module('phonecatApp'));
describe('PhoneListCtrl', function () {
it('should create "phones" model with 3 phones', inject(function ($controller) {
var scope = {},
ctrl = $controller('PhoneListCtrl', { $scope: scope });
expect(scope.phones.length).toBe(3);
}));
});
});
In SpecRunner.cshtml i have just included this files:
<script type="text/javascript" src="/Scripts/app/controllers.js"></script>
<script type="text/javascript" src="/Scripts/Spec/controllersSpec.js"></script>
In karma init, I have added the path of those 2.js.
Can you please tell me how can I do to make it work? If I run vs the Jasmine code it's ok.
Thx
You must add a reference to angular.js as well
There could be a variety of reasons for such an error, so it would help to solve with a bit more info on your part.
However off hand and having seen this error before in my battles through angular unit testing, I have to ask are you including a link to angular-mocks.js?
The lastest repo: http://code.angularjs.org/1.2.15/
Angular Mocks: http://code.angularjs.org/1.2.15/angular-mocks.js
A copy of your karma.conf.js would also help....
Related
I got an error: Uncaught TypeError: $ is not a function at app.min.js?ver=5.6.2:1 I know there are many answers to this question. But not in my case. For developing a theme, I am using gulp. So the app.min.js The file is constantly changing during development and I can't just add:
jQuery(document).ready(function($) {
});
If we were talking about a finished project, it always helps me. But not at this time. Here is part of my gulp file who is responsible for creating: app.min.js
function scripts() {
return src([
'../themes/themename/js/vendor/ajax-mail.js',
'../themes/themename/js/vendor/bootstrap.min.js',
'../themes/themename/js/vendor/imagesloaded.pkgd.min.js',
'../themes/themename/js/vendor/isotope.pkgd.min.js',
'../themes/themename/js/vendor/jquery.counterup.min.js',
'../themes/themename/js/vendor/jquery.magnific-popup.min.js',
'../themes/themename/js/vendor/owl.carousel.min.js',
'../themes/themename/js/vendor/plugins.js',
'../themes/themename/js/vendor/popper.js',
'../themes/themename/js/vendor/waypoints.min.js',
'../themes/themename/js/app.js',
])
.pipe(concat('app.min.js'))
.pipe(uglify())
.pipe(dest('../themes/themename/js'))
.pipe(browserSync.stream())
}
Maybe there is some way to automatically frame all content of the app.min.js in
jQuery(document).ready(function($) {
});
I cannot find a solution, I will be glad for the help. Thanks!
When I try to use Redux with Polymer (lit Element) I got this error:
"Process is not defined ad redux.js".
How to solve this error?
I found a hack solution from Polymer's PWA Starter kits.
Add this lines to your index.html:
<script>
// HACK(keanulee): The Redux package assumes `process` exists - mock it here before
// the module is loaded.
window.process = {
env: {
NODE_ENV: 'production'
}
};
</script>
Works like a charm.
Using ZURB Foundation Template, building with NPM.
I have the following code in my default.html layout page:
<script src="{{root}}assets/js/app.js"></script>
{{#ifpage 'admin'}}
<script src="{{root}}assets/js/single-page/admin.js"></script>
{{/ifpage}}
{{#ifpage 'dashboard'}}
<script src="{{root}}assets/js/single-page/dashboard.js"></script>
{{/ifpage}}
In gulpfile.js I have as a member of the 'javascript' PATHS array:
'!src/assets/js/single-page/**/*'
I then, do:
gulp.task('single-page', function() {
return gulp.src('src/assets/js/single-page/**/*')
.pipe(gulp.dest('dist/assets/js/single-page'))
.on('finish', browser.reload);
});
Then...
gulp.task('build', function(done) {
sequence('clean', ['pages', 'sass', 'javascript', 'single-page', 'images', 'php', 'chart_data', 'copy'], 'styleguide', done);
});
And finally...
gulp.task('default', ['build', 'server'], function() {
gulp.watch(PATHS.assets, ['copy']);
gulp.watch(['src/pages/**/*'], ['pages']);
gulp.watch(['src/{layouts,partials,helpers,data}/**/*'], ['pages:reset']);
gulp.watch(['src/assets/scss/**/{*.scss, *.sass}'], ['sass']);
gulp.watch(['src/assets/js/**/*.js'], ['javascript']);
gulp.watch(['src/assets/js/single-page/**/*.js'], ['single-page']);
gulp.watch(['src/assets/img/**/*'], ['images']);
gulp.watch(['src/assets/php/**/*'], ['php']);
gulp.watch(['src/assets/chart_data/**/*'], ['chart_data']);
gulp.watch(['src/styleguide/**'], ['styleguide']);
});
My three pages are all PHP pages with the names index.php, admin.php, and dashboard.php. The js/single-page directory is being written to the dist folder and the two JS files are there.
The Panini conditional doesn't seem to be working so the admin-specific and dashboard-specific paths do not appear on their respective PHP pages.
Colin Marshall in his answer to How to add JavaScript just for one specific page? mentions a config.yml file and a gulpfile.babel.js file, neither of which are in my project's directory.
Any suggestions?
Thank you.
Simple fix after a bit of fiddling. Seems Panini 'page' var returned the full page name including .php. Once I checked for admin.php or dashboard.php all worked fine.
I can only imagine there's some code change I can make to return the page name without the file extension.
I'm having an issue triggering method calls while writing feature tests. I'm not actually given an error in the chimp terminal log, but the server.call line is where the failure is highlighted. I believe this might be related to the folder structure of the app (which I've loosely based on Letterpress) or the order in which the call is defined and then triggered. When I move the method call out to my main.js file (in the root folder of the app), it works without a problem.
hooks.js path: /app/tests/cucumber/features/support/hooks.js
(function(){
module.exports = function() {
this.Before(function() {
console.log("server calling");
server.call("fixtures/resetUsers"); //test stops here
});
};
})();
fixtures.js /app/packages/fixtures/fixtures.js
(function(){
'use strict';
Meteor.methods({
"fixtures/resetUsers": function() {
Meteor.users.remove({});
}
});
})();
package.js /app/packages/fixtures/packages.js
Package.describe({
name: 'forum:fixtures',
version: '0.0.1',
summary: '',
debugOnly: true
});
Package.onUse(function(api) {
api.versionsFrom('1.2.1');
api.use('ecmascript');
api.addFiles('fixtures.js', 'server');
});
Note: I originally didn't have the fixtures folder wrapped in the packages folder (it still didn't work then) but came across this post by #Xolv.io, the developers of Chimp.js who advised to do so.
with the new chimp, you can just use:
server.execute(function() {
// code you put here will run on the server
});
Check this repository for examples:
https://github.com/xolvio/automated-testing-best-practices/
In your sample repo, if you define a meteor method, 'something', you can call as server.call('something').
If you have a standard method definition (not even a meteor method), say something2=function(){}, with xolvio:backdoor, you can server.execute('something2'). ( calling chimp with --ddp switch)
Is there a way to render a precompiled template that has no name on the client side in DustJs?
Because documentation only shows with a name:
<!-- precompiled templates -->
<script type="text/javascript" src="/lib/templates.js"></script>
<script type="text/javascript">
// The templates are already registered, so we are ready to render!
dust.render('hello', { world: "Saturn" }, function(err, out) {
document.getElementById('output').textContent = out;
})
</script>
EDIT : Ok it's probably too complicated to load a file, and I just noticed that when we compile without specifying name (in order to compile many template simultaneously), the path of the template is set as the default name. It is even editable with --pwd flag.
There is therefore always a name so the above function can operate.
It sounds like you would like to load templates by their path after they have been precompiled. Dust allows you to do this via AMD (require.js) compatibility.
http://www.dustjs.com/guides/setup/#amd
Once you've loaded require.js and set define.amd.dust = true, you can call dust.render with the path to a template and Dust will automatically load it for you.
Note that this requires that you compile your templates with the --amd flag.
<script src="r.js"></script>
<script type="text/javascript">
define.amd.dust = true;
require(["lib/dust-full"], function(dust) {
dust.render('path/to/your/template', function(err, out) { ... });
});
</script>
The Dust repository has an example of using AMD to load templates.