gotbahn

.foo {
  color: red;
}

.bar {
  color: red;
}

@media all and (min-width: 768px) {
  .foo {

gotbahn

language: node_js
node_js:
  - node # latest node.js version
install:
  - npm install # can be not specified, runs by default
before_script:
  - npm start & # start local server, '&' means use it as parallel process
  - sleep 5 # 5s to make sure that local server have enough time to up
script:
  - npm test # can be not specified, runs by default

gotbahn

{
  "name": "casper-travis",
  "version": "0.0.1",
  "description": "Functional tests with Casper.js in Travis CI",
  "main": "index.html",
  "scripts": {
    "preinstall": "npm i -g http-server casperjs",
    "start": "http-server",
    "test": "casperjs test tests/"
  },

gotbahn

<button class="action" type="button">Click me</button>

gotbahn

document.querySelector('.action').addEventListener('click', function () {
  this.insertAdjacentHTML('afterend', '<div class="text">You hear \'click\'</div>');
});

gotbahn

casper.test.begin('Testing index page', 1, function (test) {
	casper
		.start('http://localhost:8080')
		.then(function () {
			this.echo('Text appearing', 'COMMENT');
			this.click('.action');
			test.assertExists('.text', 'Text is appearing after click');
		})
		.run(function () {
			test.done()

gotbahn

{
  test: /\.(jpg|png|svg)$/,
  type: 'asset/resource',
  include: './path/to/images'
}

gotbahn

const pathToCat = require('./path/to/cats/grumpy-cat.png');

const getCat = () => `<img src='${pathToCat}' alt='Grumpy Cat' />`;

gotbahn

const cats = [
	'black-cat.png',
	'white-cat.png',
	'grumpy-cat.png',
	'rainbow-cat.png'
];

const getCats = () => cats.map(name => `<img src='./path/to/cats/${name}' alt='${name}' />`);

gotbahn

const pathToCats = require.context('./path/to/cats', true);
// true here is for use subdirectories, you can also specify regex as third param

const cats = [
	'black-cat.png',
	'white-cat.png',
	'grumpy-cat.png',
	'rainbow-cat.png'
];