0.3.0 • Published 8 years ago
mota-webdevtools v0.3.0
Mota Web Dev Tools
Tools to make the lives of web developers easier.
Features
var tools = require( "mota-webdevtools" );
Building
tools.findFiles( {
src: [ "src/index.js" ],
micromatch: false
} )
.lift( tools.transformers.Rollup( {
options: {},
generate: {
format: "es6"
}
} ) )
.lift( tools.transformers.rename( function( file ) {
return file.replace( "src/", "dist/" );
} ) )
.lift( tools.transformers.write() )
.subscribe( {
complete: function() {
console.log( "Build done!" );
},
error: function( e ) {
console.log( e );
}
} );
Linting
tools.readFiles( {
cwd: "src",
src: [ "**/**.js" ],
micromatch: {}
} )
.lift( tools.transformers.Lint() )
.subscribe( {
complete: function() {
console.log( "Files lint free!" );
},
error: function( e ) {
console.log( e );
}
} );
// Or, as of 0.2.1
tools.lint( {
cwd: "src",
src: [ "**/**.js" ]
}, {} ).then( null, function( e ) {
console.log( e );
} );
Server and livereload
var server = tools.createServer( 9009, function() {
// Listening in port 9009...
} );
var watcher = tools.watch( "src/**/*.js" );
watcher.on( "all", server.liveReloader );
Testing
Includes features so that you can use the same testing code on the NodeJS side or Browser side.
tools.test.exportGlobals();
// global.ROOT == global, global.ISENVNODE == true, global.QUnit == require( "qunitjs" )
tools.test.load(); // Runs QUnit.load(). It's necessary on the nodejs side.
tools.test.loadTests( [ // Synchronously loads some js files
"./spec_1.js",
"./spec_2.js"
] ); // ...same as...
[ "./spec_1.js", "./spec_2.js" ].forEach( function( file ) {
require( file );
} );
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Test Suite</title>
<!-- Includes the styles you need -->
<link rel="stylesheet" href="/mota-webdevtools/index.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<!-- Yes, there urls work because of a route that is added to the server when you do tools.createServer() -->
<script src="/mota-webdevtools/index.js"></script>
<!-- Livereload works thanks to a socket connection that is created after tools.createServer() -->
<script src="/mota-webdevtools/livereload.js"></script>
<script>
motaWebDevTools.test.exportGlobals();
// window.ROOT == window, window.ISENVNODE == false, window.QUnit == QUnit
motaWebDevTools.test.load(); // Available on the browser side but does nothing.
motaWebDevTools.test.loadTests( [ // Asynchronously loads some js files
"./spec_1.js",
"./spec_2.js"
] );
</script>
</body>
</html>
Benchmarking
var suite = tools.createBenchSuite( "Search in a string" );
suite.add( "RegExp#test", function() {
/o/.test( "Hello World!" );
} )
.add( "String#indexOf", function() {
"Hello World!".indexOf( "o" ) > -1;
} )
.add( "String#match", function() {
!!"Hello World!".match( /o/ );
} )
.run();
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Benchmark Suite</title>
</head>
<body>
<!-- The output and "Run"/"Run Async" buttons will be shown in this element. -->
<!-- Various different suites are supported. -->
<div id="benchmark"></div>
<!-- Yes, this url works because of a route that is added to the server when you do tools.createServer() -->
<script src="/mota-webdevtools/index.js"></script>
<script>
var suite = motaWebDevTools.createBenchSuite( "Search in a string" );
suite.add( "RegExp#test", function() {
/o/.test( "Hello World!" );
} )
.add( "String#indexOf", function() {
"Hello World!".indexOf( "o" ) > -1;
} )
.add( "String#match", function() {
!!"Hello World!".match( /o/ );
} );
</script>
</body>
</html>