videojs-standard #3459

Closed
wants to merge 9 commits into
from

Projects

None yet

4 participants

@misteroneill
Member
misteroneill commented Jul 25, 2016 edited

Description

As discussed in-person on Thursday, we are in a slight lull at the moment and this is a great opportunity to clean up the video.js source code (and tests) to pass videojs-standard linting and abandon jshint.

Specific Changes proposed

  • Removes jshint
  • Installs videojs-standard at 5.x
  • Adds linting scripts/tasks
  • Makes small code changes to address videojs-standard checks against src/js/*.js

Requirements Checklist

  • Feature implemented / Bug fixed
  • Reviewed by Two Core Contributors
@misteroneill misteroneill commented on the diff Jul 25, 2016
build/grunt.js
@@ -114,14 +114,6 @@ module.exports = function(grunt) {
build: ['build/temp/*'],
dist: ['dist/*']
},
- jshint: {
@misteroneill
misteroneill Jul 25, 2016 Member

This is a temporary step. The final PR in this series will restore automatic linting capabilities, but for now we want them off.

@misteroneill misteroneill commented on the diff Jul 25, 2016
src/js/button.js
@@ -3,10 +3,7 @@
*/
import ClickableComponent from './clickable-component.js';
import Component from './component';
-import * as Events from './utils/events.js';
@misteroneill
misteroneill Jul 25, 2016 Member

There are removals like this scattered around: they were unused modules.

Note: if we're only trying to import the module, we should be doing something like import './utils/events'.

@gkatsev
gkatsev Jul 25, 2016 Member

doesn't import './utils/events.js' put the exports into local scope? This is an issue for a "bag of functions" module.
import * Events from './utils/events.js' is more explicit in what we want.

@misteroneill
misteroneill Jul 25, 2016 Member

I tend to agree, but the linter doesn't like unused variable names.

@gkatsev
gkatsev Jul 25, 2016 Member

if it isn't used then we shouldn't import it, sure.

@misteroneill
misteroneill Jul 25, 2016 Member

On the topic of using the import 'foo'; style, I don't think it puts the exports into local scope. I think it simply runs the module code. MDN says:

Import an entire module for side effects only, without importing any bindings.

@misteroneill
misteroneill Jul 25, 2016 Member

Same as require('foo.js');

@gkatsev
gkatsev Jul 25, 2016 Member

Ah, interesting. I guess that's exactly what we want in player.js.

@misteroneill misteroneill and 1 other commented on an outdated diff Jul 25, 2016
src/js/clickable-component.js
@@ -121,14 +125,14 @@ class ClickableComponent extends Component {
* @return {Component} The child component (created by this process if a string was used)
* @method addChild
*/
- addChild(child, options={}) {
- // TODO: Fix adding an actionable child to a ClickableComponent; currently
+ addChild(child, options = {}) {
+ // TO_DO: Fix adding an actionable child to a ClickableComponent; currently
@misteroneill
misteroneill Jul 25, 2016 Member

videojs-standard doesn't want you leaving TODO comments around (which makes sense because they almost never get done and only cause confusion down the line), but I didn't want to simply delete them. So, I changed them to TO_DO which is kind of ugly, I know.

@BrandonOCasey
BrandonOCasey Jul 25, 2016 edited Contributor

I think the TODO rule is just a warning, should we just keep the warnings printing and work on fixing whatever it is we need to do if we want to get rid of them?

@misteroneill
misteroneill Jul 25, 2016 Member

You're right, I'll undo these changes!

@gkatsev gkatsev commented on the diff Jul 25, 2016
src/js/base-styles.js
const styles = '{{GENERATED_STYLES}}';
-if (styles === '{{GENERATED'+'_STYLES}}');
+// Don't think we need this as it's a noop?
+// if (styles === '{{GENERATED'+'_STYLES}}');
@gkatsev
gkatsev Jul 25, 2016 Member

I assume it was supposed to be something like

if (styles === '{{GENERATED'+'_STYLES'}}) {
  return;
}

So that if somehow the styles weren't inline, it won't bother with the rest.

@misteroneill
misteroneill Jul 25, 2016 Member

Hmm, thoughts on what to do, since it's clearly never done that?

@gkatsev
gkatsev Jul 25, 2016 Member

base-styles isn't even used anywhere anyway right now, so, feel free to just leave as is.

@gkatsev gkatsev and 1 other commented on an outdated diff Jul 25, 2016
src/js/player.js
@@ -26,19 +26,19 @@ import AudioTrackList from './tracks/audio-track-list.js';
import VideoTrackList from './tracks/video-track-list.js';
// Include required child components (importing also registers them)
-import MediaLoader from './tech/loader.js';
-import PosterImage from './poster-image.js';
-import TextTrackDisplay from './tracks/text-track-display.js';
-import LoadingSpinner from './loading-spinner.js';
-import BigPlayButton from './big-play-button.js';
-import ControlBar from './control-bar/control-bar.js';
-import ErrorDisplay from './error-display.js';
-import TextTrackSettings from './tracks/text-track-settings.js';
+import './tech/loader.js';
@gkatsev
gkatsev Jul 25, 2016 Member

I would much prefer the earlier version. It's much more explicit and reduces cognitive load. I don't have to go to ./tracks/text-track-settings.js to know that in here I can refer to it via TextTrackSettings.

@misteroneill
misteroneill Jul 25, 2016 Member

We'd need to turn off the linter for that line, then.

@gkatsev
gkatsev Jul 25, 2016 Member

What rule complains about this?

@gkatsev
gkatsev Jul 25, 2016 Member

oooh, these are imported to make sure they're in the package. They're not used locally in player.js.
I wonder if there's a better way of handling this.
I guess this is fine then

@misteroneill
misteroneill Jul 25, 2016 Member

Could also do require('./tech/loader.js'). I suppose it might be a little clearer that it's different from other imports?

@gkatsev
gkatsev Jul 25, 2016 Member

We do have a comment above. Maybe just elaborate on it a bit?

@gkatsev gkatsev and 1 other commented on an outdated diff Jul 25, 2016
src/js/player.js
}
// Ensure the CSS class is valid by starting with an alpha character
- if (/^[^a-zA-Z]/.test(this.id())) {
- idClass = 'dimensions-'+this.id();
+ if ((/^[^a-zA-Z]/).test(this.id())) {
+ idClass = `dimensions-${this.id()}`;
@gkatsev
gkatsev Jul 25, 2016 Member

did the linter complain about this? The reason we kept it the other way is because using the template strings here gives us no benefits over just string concatenation, and if anything, the old way is a bit cleaner.

@misteroneill
misteroneill Jul 25, 2016 Member

It complained about the infix operator not having spaces; so, I figured I'd just switch to the template string. Can switch back if desired.

@gkatsev
gkatsev Jul 25, 2016 Member

I think that in this particular case it would be a bit nicer.

'dimensions-' + this.id();
`dimensions-${this.id()}`;
@misteroneill
misteroneill Jul 25, 2016 Member

Fair enough! 👍

@gkatsev gkatsev commented on the diff Jul 25, 2016
src/js/player.js
@@ -2666,8 +2712,10 @@ class Player extends Component {
*/
// destructure the input into an object with a track argument, defaulting to arguments[0]
// default the whole argument to an empty object if nothing was passed in
- removeRemoteTextTrack({track = arguments[0]} = {}) { // jshint ignore:line
- this.tech_ && this.tech_['removeRemoteTextTrack'](track);
@gkatsev
gkatsev Jul 25, 2016 Member

my one liner T__T

@misteroneill
misteroneill Jul 25, 2016 Member

🔥 burn it down 🔥

@gkatsev gkatsev and 1 other commented on an outdated diff Jul 25, 2016
src/js/player.js
/**
* Fired when the user agent begins looking for media data
*
* @event loadstart
*/
-Player.prototype.handleTechLoadStart_;
+Player.prototype.handleTechLoadStart_ = Player.prototype.handleTechLoadStart_;
@gkatsev
gkatsev Jul 25, 2016 Member

Does the linter complain about these? I think it would be nice to keep them as stubs, if possible.

@misteroneill
misteroneill Jul 25, 2016 Member

Yeah. It complained about not expecting an expression. We could alternatively do something like:

Player.prototype.handleTechLoadStart_; // eslint-disable-line
@gkatsev gkatsev commented on the diff Jul 25, 2016
src/js/video.js
@@ -721,12 +724,12 @@ videojs.insertContent = Dom.insertContent;
* still support requirejs and browserify. This also needs to be closure
* compiler compatible, so string keys are used.
*/
-if (typeof define === 'function' && define['amd']) {
- define('videojs', [], function(){ return videojs; });
+if (typeof define === 'function' && define.amd) {
@gkatsev
gkatsev Jul 25, 2016 Member

this probably should just be deleted altogether. But maybe in a separate PR.

@misteroneill
misteroneill Jul 25, 2016 Member

Yeah, I think so. Avoiding functional changes here is a good thing! 😄

@gkatsev
Member
gkatsev commented Jul 25, 2016

LGTM

@gkatsev gkatsev added this to the Linting milestone Jul 25, 2016
@misteroneill misteroneill referenced this pull request Jul 25, 2016
Closed

src/js/utils passing videojs-standard #3460

1 of 2 tasks complete
@gkatsev gkatsev and 1 other commented on an outdated diff Jul 26, 2016
src/js/media-error.js
@@ -8,13 +8,13 @@ import assign from 'object.assign';
*
* @param {Number} code The media error code
*/
-let MediaError = function(code){
+let MediaError = function(code) {
@gkatsev
gkatsev Jul 26, 2016 Member

noting it here (but we shouldn't make this change as part of linting) but this potentially can cause a problem on IE8 since on line 22 we do MediaError.defaultMessages and IE8 is weird.

@misteroneill
misteroneill Jul 26, 2016 Member

Good catch. Switching to function MediaError(code) { would solve that, right?

@gkatsev gkatsev added minor and removed patch confirmed labels Jul 26, 2016
@misteroneill
Member

I merged all the disparate vjsstandard-* branches into this one.

@misteroneill misteroneill changed the title from videojs-standard Core to videojs-standard Source Code Jul 28, 2016
@misteroneill misteroneill changed the title from videojs-standard Source Code to videojs-standard Aug 1, 2016
@misteroneill
Member

We are treating this as the "master" branch for standardization efforts.

misteroneill and others added some commits Jul 25, 2016
@misteroneill misteroneill video.js source code passing videojs-standard v5 d9deaf1
@BrandonOCasey @misteroneill BrandonOCasey vjsstandard - Tests - Bottom half of test/unit (#3477) 0bea95a
@BrandonOCasey @misteroneill BrandonOCasey vjsstandard - Tests - Other 1/2 of Tracks folder + Misc (#3484) 6fcee09
@BrandonOCasey @misteroneill BrandonOCasey vjsstandard - Tests - Utils folder (#3482) 5a5ef4b
@BrandonOCasey @misteroneill BrandonOCasey vjsstandard - Tests - Tech folder (#3479) ae2ab52
@misteroneill misteroneill Linter v5 Compatibility (#3478)
99724c6
@pagarwal123 @misteroneill pagarwal123 Unit test linting (#3490)
d71d8d1
@misteroneill misteroneill Add ghooks to lint on push
a16d710
@BrandonOCasey @misteroneill BrandonOCasey vjsstandard - Tests - one missed file (#3497)
12a72f7
@gkatsev gkatsev closed this in 4f6cb03 Aug 5, 2016
@gkatsev
Member
gkatsev commented Aug 5, 2016

Landed!

@misteroneill misteroneill deleted the misteroneill:vjsstandard-core branch Aug 12, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment