I am an automation tester. I installed browser-sync globally to test the website we have. I tried with below code (in index.html file) for trial purpose.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<iframe src="https://www.google.co.in/" onload="this.width=screen.width;this.height=screen.height"></iframe>
</body>
</html>
I had added an iframe to open the URL I want to open and resize it to default windows size. And CSS code call above is as below:
h1
{
background: red;
}
gulf.js file code is as below:
var gulp = require('gulp');
var bs = require('browser-sync').create();
// create a browser sync instance.
gulp.task('serve', function()
{
bs.init ({
server: {
baseDir: "Desktop/BrowserSync/Demo", index: "index.html"
}
});
gulp.watch("*.html").on('change', bs.reload);
});
It is just giving the background color as red.
It is opening the Google page for me on all browsers and configurations I have. When I tried for scroll movement vertically, the same has been performed on all the opened browser window.
However, when I tried to insert any text in Google search box or click or any link on Google home page, it is not syncing/executing these actions on other opened browser windows, not even horizontal scroll.
I am totally new to browser-sync. I also tried with some gulp.js file to resolve above issue. However no success, as while running it has given me an issue like cannot find browser-sync function and package.json file is missing something like this.
See Question&Answers more detail:os
