WebRTC GitHub Repo Developer's Guide PDF
WebRTC GitHub Repo Developer's Guide PDF
WebRTC GitHub repo developer's guide
Validation
Project structure and style
JavaScript quirks
Working with GitHub
Pull request won’t merge automatically?
GitHub Pages
Unwanted commits in pull request?
Bower
Validation with Grunt plugins and Travis
Grunt
Travis
The repo is at g
ithub.com/webrtc and the samples can be viewed live at
webrtc.github.io/samples.
Before contributing code, please check the CONTRIBUTING file.
Validation
HTML, CSS and JavaScript should follow the G oogle style guide.
All JavaScript must pass ESLint validation and follow the options in samples/.eslintrc. ESLint
plugins are available for Sublime and other editors, and ESLint validation can be run as a Grunt
task. If necessary (rarely), include additional ESLint directives within individual JavaScript files.
All JavaScript files must have ' use strict'; at the top, to invoke global strict mode.
All HTML must pass HTMLHint checking. Likewise, CSSLint must not find errors (though some
warnings are acceptable).
The W3C validators for C SS and HTML are also useful.
pcConfig.iceServers[i].url
...instead of this:
pcConfig.iceServers[i]['url'];
Double quote string values in H
TML, single quote in J
avaScript (as per Google style guide).
Variables are camelCase. In general, don't use hyphens in names.
Indent with two spaces. When function calls or tests run onto multiple lines, indent with four
spaces:
var iceServers = createIceServers(turnServer.uris,
turnServer.username, turnServer.password);
...
JavaScript quirks
Watch out not to miss the var keyword in variable declarations: variables used in a function
without v
ar are in global scope.
To put a variable in global scope, make it explicit by qualifying the name with w
indow, for
example:
var video = window.video = document.querySelector(‘video’);
function successCallback(stream) {
window.stream = stream; // stream available to console
...
}
Likewise, be explicit when referring to objects belonging to window, for example
window.performance.
Bower
sudo npm install bower
Dependency version handing: h ttps://github.com/npm/node-semver
Run b
ower update in the root folder of the project or sub project (e.g. testrtc), usually if a
folder contains a bower.json file it’s considered root.
Validation with Grunt plugins and Travis
This project has been set up to enable automated testing with G
runt plugins and T
ravis.
Grunt
Grunt uses Node.js to automate tasks written in JavaScript. Two files in a project’s top level
code directory provide information for Grunt to be used with that project:
● package.json describes dependencies and other project data.
● Gruntfile.js defines options for the tasks which can be run with Grunt for the project.
For example, the Gruntfile for the WebRTC sample repo gives options for three Grunt
plugins: CSSLint, HTMLHint, ESLint. These are predefined tasks used to validate code
and check coding style. It’s also possible to write your own custom tasks using
JavaScript – for unit testing, for example.
The grunt command can be called with or without parameters, depending on settings
defined in the project’s Gruntfile. For example, with the WebRTC sample repo, grunt
htmlhint will run the HTMLHint Grunt plugin. Calling g runt on its own runs all the
tasks defined by the grunt.registerTask() method in the Gruntfile.js:
grunt.registerTask('default',
['csslint', 'htmlhint', 'eslint']);
The grunt-eslint documentation has simple instructions on how to set up Grunt with ESlint: other
plugins are installed in the same way. The Grunt plugins page has more information about
popular plugins. Options for Grunt plugins can generally be defined in a project’s Gruntfile as
well as in config files (such as . eslintrc and .csslintrc).
Travis
Once a GitHub project has been configured on the Travis website, the Travis server can hook
into the GitHub API to respond to events for that project. For example, the public project
travis-ci.org/GoogleChrome/webrtc corresponds to the GitHub project
github.com/GoogleChrome/webrtc. (Travis can also be used with private projects.)
Once Travis has been given access to the GitHub API for a project, GitHub push or pull events
trigger testing (and potentially other build steps) to be done by the Travis server. Whenever the
WebRTC samples project is pushed or pulled, the Travis server runs the following steps (this
build log gives more detail):
1. Install and test Node dependencies as defined by package.json in the project’s top level
directory.
2. Call the command defined by the scripts.test property in package.json, which for this
project is as follows:
"scripts": {
"test": "grunt --verbose"
}
As described above, calling the g runt command on its own for this project will run three
tasks as defined in Gruntfile.js: CSSLint, HTMLHint and ESLint.
3. Once all tests have been completed, Travis reports success or failure. Travis can be
configured to provide various types of notification. Currently this project is set to send
an email to the project owner ([email protected]). Travis also updates a project status
icon which can be included in documentation on GitHub:
![Travis](https://travis-ci.org/webrtc/samples.svg?branch=master)
The travis.yml file at the project’s top level directory defines the language environment, which in
this case is Node.js, and can be used for other settings.
Travis can also be used to automate build tasks, though this is not currently used by the
WebRTC samples project.