grunt-browser-sync double injection of the reload script

Question

i'm using browsersync on a patterlab project (https://github.com/pattern-lab/patternlab-php) and patternlab page is divided by a body for the patterlab controls and and iframe with the styleguide contents.

what happens is the js script is injected twice in the page, in both "bodies". and every time i do a css change, the page snaps back on top and it's annoying.

i've update to 2.0.0 to use https://www.browsersync.io/docs/options/#option-snippetOptions but i'm no expert of regex and i don't even know if i'm on the right path here.

the reload script should only be applied inside the iframe:

i can't seem to find a solution any help is greatly appreciated thanks a lot

Answer 1

This issue was addressed in the latest version of Pattern Lab / Node. The secret sauce was:

snippetOptions: {
  blacklist: ['/index.html', '/']
}

It seems like BrowserSync wants those blacklist strings to be leading-slash URL fragments rather than filesystem paths.