In my options, I have a reporter and reporterOutput defined on my grunt task for jshint. But I'd like to write out two files from the same data. Is it possible with jshint using the options or do I just need to define 2 grunt tasks that will do the same thing but output different formats of the same results?
I also want to do the same thing with jscs output.
In your custom reporter, in order to create the output file you just return the following code:
process.stdout.write(reportHtmlJS);
Let's imagine reporterHTMLJS is your custom HTML output. What you can do before that is just use that HTML and create a second file, before the JSHint or JSCS module creates it. Something similar to that:
fs = require('fs');
fs.writeFile("./jshint/secondJSHintReport.html", reportHtmlJS, function (err) {
if (err) {
console.log(err);
}
});
You can also use some Grunt module, like grunt-contrib-copy and grunt-contrib-rename, and create new grunt task that will execute first jshint/jscs and then copy the file and rename it.
grunt.task.run("jshint copy:jshint rename:jshint");
grunt.task.run("jscs copy:jscs rename:jscs");
Related
Current situation:
We are using cypress for test automation. We have a folder named 'integration' which contains several 'spec' files. These spec files can contain one or more tests related to each other.
Problem:
I want to organize the cypress test automation on bamboo properly. What I want to do is have test suites e.g.
Playground_suite contains: 1) slide_tests_spec.js
2) teeter_totters_tests_spec.js ...
Road_suite contains: 1) car_tests_spec.js 2) truck_tests_spec.js ...
The I have the option of running Playground_suite that will only run the spec files defined in this suite.
Is this possible in cypress, if yes, how? Please help.
We had faced this same type of issue. What we had come up to solve the same issue was the following:
00_suite.example.js:
import Test01 from './e2e_test01.example.js';
import Test02 from './e2e_test02.example.js';
import Test03 from './e2e_test03.example.js';
describe('Cypress_PreTest_Configuration', function() {
console.log(Cypress.config());
});
// This is an example suite running tests in a specified order -
// All tests contained in each of these files will be run before the next
// file is processed.
describe('Example_E2E_Test_Suite', function() {
Test01();
Test02();
Test03();
});
describe('Example_Reverse_Ordered_E2E_Test_Suite', function() {
Test03();
Test02();
Test01();
});
The key in the actual test files is that they contain the "export default function() {}" option prior to the describe suite definition(s):
e2e_test01.example.js:
export default function() {
describe('Example_Tests_01', function() {
it('TC01 - Example Tiger Tests', function() {
doNothingOne();
console.log(this.test.parent.parent.title);
cy.visit(this.commonURIs.loginURI);
})
})
}
When attempting to run the e2e_test*.example.js files within the Cypress UI, you will find that the UI will report that there are no tests found. You will have to execute the tests through through the suite definition files. We had approached this limitation with only using the 'suite' approach for E2E tests while we utilize the standard spec files for regression and minimum acceptance testing.
I hope that this example is helpful for you and perhaps someone else may have an other solution.
Right now, I am using Gulp for a project which is basically a CSS framework. The way I am doing it right now is, I #import all the other .less files in a single app.less and then pass it to the Gulp task:
// Compile
gulp.task("compile", function() {
return gulp
.src("source/app.less")
.pipe(less())
.pipe(concat("framework.edge.css"))
.pipe(gulp.dest("./dist"))
.pipe(
autoprefixer({
browsers: ["last 4 versions"],
cascade: false
})
)
.pipe(concat("framework.css"))
.pipe(gulp.dest("./dist"))
.pipe(sourcemaps.init())
.pipe(
uglify({
maxLineLength: 80,
UglyComments: false
})
)
.pipe(concat("framework.min.css"))
.pipe(sourcemaps.write("./"))
.pipe(gulp.dest("./dist"));
});
This works totally as expected. The stylesheets are first compiled and the exported as app.edge.css, then it is passed through autoprefixer, exporting framework.css and then the minification process.
The problem is, now I want to export each stylesheet as a separate module, such as
grids.css
scaffolding.css
and so on...
How can I achieve this? I am actually not getting what logic to apply.
Use globbing
If a gulp tasks's src is x/**/*.less, the task will process all LESS files in x or any subfolder of x and will output each file separately in the dest, preserving the src's file structure.
To exclude a file or files, use !....
Learn the globbing rules in the Glob Primer, and test your pattern with the Glob online tester
Depending on your needs, you might want two tasks, one for outputting individual files and one for building the full framework.css.
I have my Gulp file set up:
elixir(function(mix) {
mix.sass('app.scss').sass('admin.scss');
});
Which in my eyes should take both scss files and compile them into the public css folder.
However, it just creates one app.css file and doesn't create the admin.css file.
My terminal shows:
[23:01:43] Running Sass: resources/assets/sass/app.scss
[23:01:44] Running Sass: resources/assets/sass/admin.scss
[23:01:44] Finished 'watch' after 315 ms
[23:01:44] gulp-notify: [Laravel Elixir] Sass Compiled!
[23:01:45] gulp-notify: [Laravel Elixir] Sass Compiled!
So whats happening with the admin.scss file?
To do this you have to specify the output folder for each file (and also restart gulp / gulp watch)
elixir(function(mix) {
mix
.sass('app.scss', './public/css/app.css')
.sass('admin.scss', './public/css/admin.css');
});
Once again, people at Larachat have pointed me in the right direction, so I thought I put this info here.
Turns out it's pretty easy, and it's documented: http://laravel.com/docs/5.1/elixir#sass
Just put the files in an array instead of calling sass two times, like this:
mix.sass(['app.scss', 'admin.scss'], 'public/css')
Here is the thing. I have following structure of my LESS files:
/less/root.less
/less/includes1/*.less (a lot of less files)
/less/includes2/*.less (a lot of less files)
I am using gulp to compile my LESS files. Source:
gulp.task('less', function () {
var combined = combiner.obj([
gulp.src('./less/**/*.less'),
less(),
gulp.dest('./www/dist/screen.css')
]);
// any errors in the above streams will get caught by this listener, instead of being thrown:
combined.on('error', console.error.bind(console));
return combined;
});
The problem is in the specified path. I understand this path ./less/**/*.less like this: Recursively go through all folders and compile all files that ends .less. Problem is that compiler wants to compile each file one by one and doesnt know that all files are included to my source.less. It doesnt look for root files and doesnt know what files are included parts and what are root files.
How do I tell LESS parser which files are root and which files are to be imported. In SASS it is specified via underscore in file name like this: _includedPart.scss.
Well you can use https://github.com/robrich/gulp-ignore. See: How can I use a glob to ignore files that start with an underscore?
var condition = '_*.less'; //exclude condition
gulp.src('content/**/*.less')
.pipe(gulpIgnore.exclude(condition))
In many situations you all your Less code into a single CSS file. Your main file(s) contain #import directive which point all other required Less files.
How could I specify output file name based on input file name?
I'm specifically trying to use grunt task (grunt-closure-tools or grunt-closure-compiler) to compile (minify) multiple javascript files, let's say all satisfying '/source/**/*.js' and want to output them in format $(original_file_path_without_extension).min.js
In all samples I've seen, the output is specified as single file only but I need to minify each file separately and into the same folder where the original file comes from.
Finally, I figured out the configuration. The trick is in building the files object dynamically (as described here). My configuration for grunt-closure-tools looks like this:
closureCompiler: {
options: {
// .. YOUR OPTIONS (ommited)
},
minify: {
files: [
{
expand: true,
src: ['source/**/*.js', '!source/**/*.min.js'],
ext: '.min.js'
}
]
}
}
Closure-compiler is designed to simultaneously compile all of your javascript into a single file to minimize requests. There are really only two use cases where separate output files are supported:
Multiple modules
In order to preserve renaming references, you'll have to compile your files simultaneously. The way to do that and maintain separate files is with modules. See How do I split my javascript into modules using Google's Closure Compiler?
Non-related Files
If your files don't have inter-dependencies, then you would simply run your grunt task multiple times - one for each file.