User:Jeblad/Wikistats 2.0/Vagrant

Short description of how to set up a Vagrant box for Wikistats2. The primary repo can be found at git:analytics/wikistats2 and the secondary repo can be found at Github:wikimedia/analytics-wikistats2.

Content of Vagrantfile

Vagrant.configure(2) do |config|

    config.vm.box = "ubuntu/bionic64"
    config.vm.network :forwarded_port, guest: 80, host: 8080
    config.vm.network "forwarded_port", guest: 3306, host: 3309
    config.vm.network "forwarded_port", guest: 5000, host: 5001
    config.vm.network "forwarded_port", guest: 9876, host: 9877

    config.vm.provision :shell, :inline => "curl -sL https://deb.nodesource.com/setup_11.x | bash - && apt-get -y install nodejs"

end

Install Node with friends. Note the extra npm install -g gulp, not sure why it is necessary.

$ vagrant ssh
$ cd /vagrant
$ git clone https://gerrit.wikimedia.org/r/analytics/wikistats2
$ cd wikistats2
$ npm install gulp
$ npm install
$ npm install -g gulp
$ cd semantic
$ gulp build

Install the review process in the host.

$ sudo apt-get install git-review

App server

Open a terminal for the repackage process

$ vagrant ssh
$ cd /vagrant/wikistats2
$ npm run dev

Open a terminal for the server

$ vagrant ssh
$ cd /vagrant/wikistats2/dist-dev
$ npm run server

The app server can then be found at http://localhost:5001

Testing

Install a headless browser. Also edit the karma.conf.js, changing the line browsers: ['PhantomJS','Chrome'], and add headless entries in package.json.

$ npm install karma-phantomjs-launcher --save-dev
$ sudo apt-get install libfontconfig1
$ npm run testDev-headless

Then add an entry in karma.config.js

browsers: ['PhantomJS', 'Chrome'],

and two lines in package.json

"test-headless": "./node_modules/karma/bin/karma start --single-run --browsers PhantomJS",
"testDev-headless": "./node_modules/karma/bin/karma start --browsers PhantomJS",

there are also a third line "karma-phantomjs-launcher": "^1.0.4", from the previous npm install.

The karma server can be found at http://localhost:9877

Linting

It can be wise to install eslint, but as it probably should be available both in the client and host, and those could have different dependencies, it should thus be installed globally. It is not necessary to run eslint in the host unless it is run as part of an editors linting process.

In the host

$ sudo npm install -g eslint
$ sudo npm install -g eslint-plugin-jasmine

In the client

$ vagrant ssh
$ sudo npm install -g eslint
$ sudo npm install -g eslint-plugin-jasmine

Then create a eslintrc file, for example as

module.exports = {
    "env": {
        "es6": true,
        "browser": true,
        "node": true,
        "jasmine": true
    },
    "extends": "eslint:recommended",
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module"
    },
    "rules": {
        "indent": [
            "error",
            4,
            { "SwitchCase": 1 }
        ],
        "linebreak-style": [
            "error",
            "unix"
        ],
        "quotes": [
            "error",
            "single"
        ],
        "no-unused-vars": [
            "error",
            { "vars": "local" }
        ],
        "no-console": [
            "error",
            { "allow": [ "info", "warn", "error" ] }
        ],
        "no-warning-comments": "warn",
        "semi": [
            "error",
            "always",
            { "omitLastInOneLineBlock": true }
        ],
        "no-fallthrough": [
            "error",
            { "commentPattern": "break[\\s\\w]*omitted" }
        ]
    },
    "overrides": [
      {
        "files": ["*.spec.js"],
        "rules": {
          "semi": "off",
          "no-unused-vars": "off",
          "no-undef": "off"
        }
      },
      {
        "files": ["isoLookup.js","uniques.js"],
        "rules": {
            "indent": [
                "error",
                2
            ]
        }
      },
      {
        "files": ["_src/config/index.js", "world-50m.js","isoLookup.js","uniques.js"],
        "rules": {
            "quotes": [
                "error",
                "double"
            ]
        }
      },
      {
        "files": ["src/config/index.js"],
        "rules": {
            "quotes": "off"
        }
      }
    ]
};