Add dynamic Grunt Watch task

[netweb]

Add a new Grunt task watch to dynamically update CSS and JS assets in BP's /src folder via grunt watch

The attached patch re-implements much of what we removed in r8954

Note: This watch task differs from WordPress & bbPress as no minified assets are built or copied to the /build folder.

Needs rigorous testing and auditing to ensure correct number of files and correct filenames are correctly copied and built to the /build folder during grunt release

[netweb]

Diff of the /build folder via grunt release: (before and after of this tickets 6382.diff patch)

$ git status
On branch master
Changes not staged for commit:
  (use "git add/rm <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)

	modified:   bp-activity/admin/js/admin.min.js
	modified:   bp-activity/js/mentions.min.js
	deleted:    bp-core/deprecated/js/autocomplete/jquery.autocomplete.min.js
	deleted:    bp-core/deprecated/js/autocomplete/jquery.autocompletefb.min.js
	deleted:    bp-core/deprecated/js/autocomplete/jquery.bgiframe.min.js
	deleted:    bp-core/deprecated/js/autocomplete/jquery.dimensions.min.js
	modified:   bp-core/js/avatar.min.js
	modified:   bp-core/js/bp-plupload.min.js
	modified:   bp-core/js/confirm.min.js
	modified:   bp-core/js/jquery-cookie.min.js
	modified:   bp-core/js/jquery-query.min.js
	modified:   bp-core/js/jquery-scroll-to.min.js
	deleted:    bp-core/js/jquery.atwho.min.js
	deleted:    bp-core/js/jquery.caret.min.js
	modified:   bp-core/js/webcam.min.js
	modified:   bp-core/js/widget-members.min.js
	modified:   bp-friends/js/widget-friends.min.js
	modified:   bp-groups/admin/js/admin.min.js
	modified:   bp-groups/js/widget-groups.min.js
	modified:   bp-members/admin/js/admin.min.js
	deleted:    bp-templates/bp-legacy/css/twentyfifteen.scss
	modified:   bp-templates/bp-legacy/js/buddypress.min.js
	modified:   bp-templates/bp-legacy/js/password-verify.min.js
	modified:   bp-xprofile/admin/js/admin.min.js
	modified:   buddypress.pot

Untracked files:
  (use "git add <file>..." to include in what will be committed)

	bp-core/deprecated/js/autocomplete/jquery.min.js
	bp-core/js/jquery.min.js
	bp-forums/bbpress/bb-admin/js/admin-forums.min.js
	bp-forums/bbpress/bb-admin/js/common.min.js
	bp-forums/bbpress/bb-admin/js/utils.min.js
	bp-forums/bbpress/bb-includes/js/jquery/hoverIntent.min.js
	bp-forums/bbpress/bb-includes/js/jquery/interface.min.js
	bp-forums/bbpress/bb-includes/js/jquery/jquery.min.js
	bp-forums/bbpress/bb-includes/js/jquery/password-strength-meter.min.js
	bp-forums/bbpress/bb-includes/js/profile-edit.min.js
	bp-forums/bbpress/bb-includes/js/topic.min.js
	bp-forums/bbpress/bb-includes/js/wp-ajax-response.min.js
	bp-forums/bbpress/bb-includes/js/wp-lists.min.js

no changes added to commit (use "git add" and/or "git commit -a")

The full diff changeset is attached in ​build-6382.diff, it looks like there are some actual fixes here and some breakage, will have to just dig though this closely :)

[DJPaul]

I don't have enough time to shepherd this into 2.3, but if anyone else does, great. Otherwise, I'll look at it for 2.4.

[r-a-y]

FYI, I'm using a simplified version of netweb's patch just for companion stylesheet dev at the moment :)

[DJPaul]

Taking a look at this. Notes:

• Patch removes SASS files from build. (this is OK)
• Patch removes extDot: 'last', for uglify, from the old patch. Not sure why. (Why?)

[DJPaul]

Goal:
Run equivalent tasks from grunt commit for each of the watch categories when a file changes.

Problems:

• When watch js, making an invalid change to buddypress.js (removing a semi-colon, etc), is not caught. For jsvalidate and jshint, it says "0 files are valid" which I take to mean it has checked 0 files, because the output is not a warning.
• grunt watch gets caught in some kind of runaway loop.
• grunt watch:all copies the intention from WordPress, which is to copy those files into the build folder. BP doesn't want that.
• grunt watch:styles needs to run on all changed SASS in the bp-legacy (but not .CSS), and needs to run on .CSS everywhere else. It also needs all the tasks added to it: scsslint, sass, cssjanus. (same as from the src task)
• This is a proper PITA to work on.

[DJPaul]

I've attached my latest efforts, 6382.3.patch, but needs much more work to fix the issues to enable more testing.

[netweb]

#7021 was marked as a duplicate

[netweb]

In 6382.4.patch​ is a rudimentary refresh of 6382.3.patch​ with a couple of tweaks to get started, now to iterate further and address the concerns already noted in this ticket.

Moving to 3.0 to get this watch task in finally

See also: #7551 and cc @hnla

[hnla]

@netweb I'll patch with latest and test the workflow a bit later for the Nouveau aspects.

[hnla]

@netweb some quick reports on a patched gruntfile and running tasks:

Watch seems not to be picking up changes on the partials in /common-styles/ - not looked closely at why so may be something obvious or that I've done.
Yep seemed to be my issue, watch task running ok.

edit/ no it's not :0 odd behaviour? It's not running on subsequent changes to partial files, didn't on the first file changed but then trying again a bit later did kick watch into life, now it's stopped again, not sure where the issue lies, suspect my end but no time to look deeply at the moment.

Running 'src' task highlights a possible issue where I have a additional template pack dir under /bp-templates/ while that is disabled as such, tasks do see this and try and jshint/stylelint it's files.

At the moment it's linting the compiled '.css' file so maybe we need to do:

'!bp-templates/*/css/buddypress.css'

instead of:
'!bp-templates/bp-nouveau/css/buddypress.css'

wild card the template packs dirs where we exclude ( and possibly for sass too)?

The result of src task appears to compile the rtl file but not the .css one after a change to one of the partial scss files - this may be due to not seeing the change and running the buddypress.scss compile, it's something like that.

[DJPaul]

refresh for trunk

[DJPaul]

The latest state of this patch is not minifying the RTL CSS files. I'm looking into this with the aim to having it committed.

(EDIT: 6.patch should fix this)

[DJPaul]

@netweb Can you spare up this January please to get this done once and for all? If you can't, please let us know. I don't think Hugo and I have enough collective Grunt knowledge to make this work. Otherwise, this ticket is moving back to Future Release...

6.patch is the latest iteration. I've fixed a few things that looked wrong, and also removed rtlcss:dynamic because I don't think we need that.

(For clarity, we don't need to watch the build folder for changes, only src. To remind, some tasks only run on the build folder, which is fine).

[mercime]

We need this esp for the Twenty * stylesheets

[imath]

Let's try to work on this during next development cycle