"File changed" HTML notification no longer appears after upgrading browser-sync version

Issue details

When changing a CSS file listed into the files array, and having notify: true (default value), the notification about “File changed” does not appear.

I don’t remember its exact text, however I’m pretty sure I got it in some earlier versions of browser-sync.

Steps to reproduce/test case

Just include a CSS file into the files array of the object given to browserSync(), open the web and later edit and save such a CSS file.

Please specify which version of Browsersync, node and npm you’re running

• Browsersync: 2.22.0
• Node: 8.1.2
• Npm: 5.6.0

Affected platforms

• linux
• windows
• OS X
• freebsd
• solaris
• other (please specify which)

Browsersync use-case

• Gulp

for all other use-cases, (gulp, grunt etc), please show us exactly how you’re using Browsersync

const browserSync = require('browser-sync');

gulp.task('livebrowser', (done) =>
{
	browserSync(
		{
			open      : 'external',
			host      : 'mylocaldomain.org',
			server    :
			{
				baseDir : 'out'
			},
			https     : true,
			notify    : true,
			ghostMode : false,
			files     : path.join('out', '**', '*')
		});

	done();
});

[jaclyntan]

I have just realised this was an intended change - several releases ago. 😐

Please reconsider making the notification overlay an option - it was so handy for me to know at a glance that the page has updated. I styled my notification so it was just a tiny box in the bottom corner - it doesn’t have to be a huge ass modal. Having instant feedback without having to look specifically at the user messages tab in my console helps me code so much faster 😦

[ibc]

Completely agreed. Sometimes it takes so long for the CSS changes to become effective (it depends on how busy the CPU is, whether SASS or similar is being compiling the CSS, etc.

Having this as an optional setting would be great.