Fix peertube with google bot

client/e2e/protractor.conf.js

@@ -10,14 +10,42 @@ exports.config = {
   ],
 
   seleniumAddress: 'http://hub-cloud.browserstack.com/wd/hub',
-  capabilities: {
+  commonCapabilities: {
     'browserstack.user': process.env.BROWSERSTACK_USER,
     'browserstack.key': process.env.BROWSERSTACK_KEY,
-    'browserName': 'chrome',
     'browserstack.local': true,
     'project': 'PeerTube'
   },
 
+  multiCapabilities: [
+    {
+      browserName: 'Chrome',
+      version: '66'
+    },
+    {
+      browserName: 'Chrome',
+      version: '66',
+      os: 'android',
+
+    },
+    {
+      browserName: 'Safari',
+      version: '11.1'
+    },
+    {
+      browserName: 'Firefox',
+      version: '52' // ESR
+    },
+    {
+      browserName: 'Firefox',
+      version: '60'
+    },
+    {
+      browserName: 'Edge',
+      version: '17'
+    }
+  ],
+
   maxSessions: 1,
   baseUrl: 'http://localhost:4200/',
   framework: 'jasmine',
@@ -34,3 +62,7 @@ exports.config = {
     jasmine.getEnv().addReporter(new SpecReporter({spec: {displayStacktrace: true}}))
   }
 }
+
+exports.config.multiCapabilities.forEach(function (caps) {
+  for (var i in exports.config.commonCapabilities) caps[i] = caps[i] || exports.config.commonCapabilities[i]
+})

client/e2e/src/po/login.po.ts

@@ -4,8 +4,8 @@ export class LoginPage {
   async loginAsRootUser () {
     await browser.get('/login')
 
-    element(by.css('input#username')).sendKeys('root')
-    element(by.css('input#password')).sendKeys('test1')
+    await element(by.css('input#username')).sendKeys('root')
+    await element(by.css('input#password')).sendKeys('test1')
 
     await element(by.css('form input[type=submit]')).click()
 

client/e2e/src/po/video-watch.po.ts

@@ -24,15 +24,19 @@ export class VideoWatchPage {
       .then(seconds => parseInt(seconds, 10))
   }
 
-  async pauseVideo () {
-    const el = element(by.css('video'))
+  async pauseVideo (pauseAfterMs: number) {
+    await browser.wait(browser.ExpectedConditions.invisibilityOf(element(by.css('.vjs-loading-spinner'))))
+
+    const el = element(by.css('div.video-js'))
     await browser.wait(browser.ExpectedConditions.elementToBeClickable(el))
 
+    await browser.sleep(pauseAfterMs)
+
     return el.click()
   }
 
-  async clickOnFirstVideoOfList () {
-    const video = element(by.css('.videos .video-miniature:first-child .video-thumbnail'))
+  async clickOnVideo (videoName: string) {
+    const video = element(by.css('.videos .video-miniature .video-thumbnail[title="' + videoName + '"]'))
 
     await video.click()
 

client/e2e/src/videos.e2e-spec.ts

@@ -34,15 +34,13 @@ describe('Videos workflow', () => {
   })
 
   it('Should go on video watch page', async () => {
-    await videoWatchPage.clickOnFirstVideoOfList()
+    await videoWatchPage.clickOnVideo(videoName)
 
     return videoWatchPage.waitWatchVideoName(videoName)
   })
 
   it('Should play the video', async () => {
-    await browser.sleep(4000)
-
-    await videoWatchPage.pauseVideo()
+    await videoWatchPage.pauseVideo(2500)
     expect(videoWatchPage.getWatchVideoPlayerCurrentTime()).toBeGreaterThanOrEqual(2)
   })
 })

client/package.json

@@ -23,7 +23,8 @@
   },
   "license": "GPLv3",
   "resolutions": {
-    "videojs-dock/video.js": "^6"
+    "videojs-dock/video.js": "^6",
+    "webtorrent/create-torrent/junk": "^1"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~0.6.1",
@@ -102,6 +103,7 @@
     "webpack-bundle-analyzer": "^2.9.1",
     "webpack-cli": "^2.0.14",
     "webtorrent": "^0.98.0",
+    "whatwg-fetch": "^2.0.4",
     "zone.js": "~0.8.5"
   },
   "dependencies": {

client/src/app/core/auth/auth.service.ts

@@ -11,6 +11,7 @@ import { environment } from '../../../environments/environment'
 import { RestExtractor } from '../../shared/rest'
 import { AuthStatus } from './auth-status.model'
 import { AuthUser } from './auth-user.model'
+import { objectToUrlEncoded } from '@app/shared/misc/utils'
 
 interface UserLoginWithUsername extends UserLogin {
   access_token: string
@@ -113,17 +114,18 @@ export class AuthService {
 
   login (username: string, password: string) {
     // Form url encoded
-    const body = new URLSearchParams()
-    body.set('client_id', this.clientId)
-    body.set('client_secret', this.clientSecret)
-    body.set('response_type', 'code')
-    body.set('grant_type', 'password')
-    body.set('scope', 'upload')
-    body.set('username', username)
-    body.set('password', password)
+    const body = {
+      client_id: this.clientId,
+      client_secret: this.clientSecret,
+      response_type: 'code',
+      grant_type: 'password',
+      scope: 'upload',
+      username,
+      password
+  }
 
     const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')
-    return this.http.post<UserLogin>(AuthService.BASE_TOKEN_URL, body.toString(), { headers })
+    return this.http.post<UserLogin>(AuthService.BASE_TOKEN_URL, objectToUrlEncoded(body), { headers })
                .pipe(
                  map(res => Object.assign(res, { username })),
                  mergeMap(res => this.mergeUserInformation(res)),

client/src/app/shared/misc/utils.ts

@@ -55,6 +55,15 @@ function immutableAssign <A, B> (target: A, source: B) {
   return Object.assign({}, target, source)
 }
 
+function objectToUrlEncoded (obj: any) {
+  const str: string[] = []
+  for (const key of Object.keys(obj)) {
+    str.push(encodeURIComponent(key) + '=' + encodeURIComponent(obj[key]))
+  }
+
+  return str.join('&')
+}
+
 // Thanks: https://gist.github.com/ghinda/8442a57f22099bdb2e34
 function objectToFormData (obj: any, form?: FormData, namespace?: string) {
   let fd = form || new FormData()
@@ -100,6 +109,7 @@ function isInMobileView () {
 }
 
 export {
+  objectToUrlEncoded,
   getParameterByName,
   populateAsyncUserVideoChannels,
   getAbsoluteAPIUrl,

client/src/assets/player/peertube-player.ts

@@ -1,5 +1,21 @@
 import { VideoFile } from '../../../../shared/models/videos'
 
+import 'core-js/es6/symbol';
+import 'core-js/es6/object';
+import 'core-js/es6/function';
+import 'core-js/es6/parse-int';
+import 'core-js/es6/parse-float';
+import 'core-js/es6/number';
+import 'core-js/es6/math';
+import 'core-js/es6/string';
+import 'core-js/es6/date';
+import 'core-js/es6/array';
+import 'core-js/es6/regexp';
+import 'core-js/es6/map';
+import 'core-js/es6/weak-map';
+import 'core-js/es6/set';
+import 'core-js/es7/object';
+
 import 'videojs-hotkeys'
 import 'videojs-dock'
 import './peertube-link-button'

client/src/standalone/videos/embed.ts

@@ -1,5 +1,8 @@
 import './embed.scss'
 
+// For google bot that uses Chrome 41 and does not understand fetch
+import 'whatwg-fetch'
+
 import * as videojs from 'video.js'
 
 import { VideoDetails } from '../../../../shared'

client/yarn.lock

@@ -5214,9 +5214,9 @@ jszip@^3.1.3:
     pako "~1.0.2"
     readable-stream "~2.0.6"
 
-junk@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/junk/-/junk-2.1.0.tgz#f431b4b7f072dc500a5f10ce7f4ec71930e70134"
+junk@^1, junk@^2.1.0:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/junk/-/junk-1.0.3.tgz#87be63488649cbdca6f53ab39bec9ccd2347f592"
 
 k-bucket@^4.0.0:
   version "4.0.0"
@@ -10206,7 +10206,7 @@ webtorrent@^0.98.0:
     xtend "^4.0.1"
     zero-fill "^2.2.3"
 
-whatwg-fetch@>=0.10.0:
+whatwg-fetch@>=0.10.0, whatwg-fetch@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"
 

config/test.yaml

@@ -1,4 +1,5 @@
 listen:
+  listen: '0.0.0.0'
   port: 9000
 
 webserver: