inserting body element and script into iframe src html document

[rkoberg]

Is there some way to stop/ignore html files loaded in iframes? I am using this from the gulp-angular-generator. I have tried several options. The files that get loaded are from a directory not watched by anything -- just served.

In this screen grab you will a body element and script that do not exist in the src:

The server looks like:

function browserSyncInit(baseDir, files, browser) {
  browser = browser === undefined ? 'default' : browser;

  var routes = null;
  if(baseDir === 'src' || (util.isArray(baseDir) && baseDir.indexOf('src') !== -1)) {
    routes = {
      // Should be '/bower_components': '../bower_components'
      // Waiting for https://github.com/shakyShane/browser-sync/issues/308
      '/bower_components': 'bower_components'
    };
  }

  browserSync.instance = browserSync.init(files, {
    open: false,
    notify: false,
    host: "tmcdev.psoc.dev",
    codeSync: false,
    ghostMode: false,
    startPath: '/index.html',
    server: {
      baseDir: baseDir,
      middleware: [
        modRewrite([
          '!\\.\\w+$ /index.html [L]'
        ])
      ],
      routes: routes
    },
    browser: browser
  });
}

gulp.task('serve', ['watch'], function () {
  browserSyncInit([
    'src',
    '.tmp'
  ], [
    '.tmp/{app,components}/**/*.css',
    'src/assets/images/**/*',
    'src/*.html',
    'src/{app,components}/**/*.html',
    'src/{app,components}/**/*.js'
  ]);
});

Watch looks like:

gulp.task('watch', ['styles'] ,function () {
  gulp.watch('src/{app,components}/**/*.scss', ['styles']);
  gulp.watch('src/{app,components}/**/*.js', ['scripts']);
  gulp.watch('src/assets/images/**/*', ['images']);
  gulp.watch('bower.json', ['wiredep']);
});

[rkoberg]

The body gets put in with gulp-connect too, so that part is not part of this bug/feature request.

I am able to turn off gulp-connect's livereload JS insertions.

[shakyShane]

Hi - thanks for the details.

I've been looking at this recently and I'm leaning towards the idea of providing more options regarding the snippet injection.

One of them will be something like excludePaths where you could say "don't touch files that match this pattern". Maybe something like this:

snippet: {
    excludePaths: ["app/templates/*.html"]
}

Do you think that would solve your issue?

[rkoberg]

Sure, that would do it.

[shakyShane]

Ok, it's happening.

You'll be able to do either

snippet: {
    excludePaths: ["app/templates/*.html"]
}

or, which may actually be more useful, there'll also be includePaths. The following example will ignore everything other than html files in app

snippet: {
    includePaths: ["app/*.html"]
}

[shakyShane]

https://github.com/shakyShane/resp-modifier/commits/master

[shakyShane]

in 1.7.0

http://www.browsersync.io/docs/options/#option-snippetOptions

[rkoberg]

Great, thanks for the quick work!