使用单个Gulp任务运行Protractor

时间:2015-08-02 19:50:06

标签: angularjs gulp protractor

有没有办法在单个任务中使用Protractor和Gulp运行e2e测试?

现在,为了运行e2e测试,我必须打开3个单独的shell并运行以下命令:

webdriver-manager update

webdriver-manager start

npm start (which runs the app server)

protractor protractor.conf.js (in a separate window)

必须有一种更简单的方法来运行这些测试。有什么想法吗?

4 个答案:

答案 0 :(得分:8)

这是一个可行的解决方案

var protractor = require("gulp-protractor").protractor;
var spawn = require('child_process').spawn; 

//run webdriver method
function runWebdriver(callback) {
    spawn('webdriver-manager', ['start'], {
        stdio: 'inherit'
    }).once('close', callback);
}

//run protractor.config method
function runProtractorConfig() {
    gulp.src('./**/*-page.spec.js')
        .pipe(protractor({
            configFile: 'protractor.config.js'
        }))
        .on('error', function (e) {
            throw e;
        });
}
//execute protractor.config after webdriver is executed
function runWebdriverProtractor(){
    runWebdriver(runProtractorConfig);
}
//put them into gulp task
gulp.task('run-protractor', runWebdriverProtractor);

答案 1 :(得分:3)

是的,这是可能的。

  1. 第一种方式:(仅用于通过简单的命令从控制台运行它"量角器[配置文件]"
  2. 用NPM运行一次命令:

    npm install protractor@2.5.1
    npm install selenium-standalone-jar@2.45.0
    

    这将安装所需的软件包。

    接下来用selenium standalone而不是selenium地址修改protractor.conf.js:

    //seleniumAddress: 'http://localhost:4444/wd/hub',
    seleniumServerJar: './node_modules/selenium-standalone-jar/bin/selenium-server-standalone-2.45.0.jar',
    

    现在当你运行量角器[配置文件]时:protractor protractor.conf.js他将为自己启动selenium并进行测试。

    1. 第二种方式:
    2. 您可以将其实施到构建过程中,在使用GULP进行构建期间,他将为您开发量角器,量角器将自行启动硒驱动器。

      我看到你执行这些命令真的很累,为什么你会这样做,只需用Gulp为你做这件事。

      我会在工作示例中向您解释。

      您只需要:

      添加到您的(NPM)package.json文件:(选择适合您的版本,这对我有用。

      "gulp-protractor": "^2.1.0",
      "protractor": "2.5.1",
      "selenium-standalone-jar": "2.45.0",
      

      然后你需要protractor.conf.js中的正确配置: 您需要替换" seleniumAddress"使用直接JAR文件,因此量角器将为您激活它并自动附加到它! 一块文件是:

          framework: 'jasmine',
          //seleniumAddress: 'http://localhost:4444/wd/hub',
          seleniumServerJar: './node_modules/selenium-standalone-jar/bin/selenium-server-standalone-2.45.0.jar',
      

      seleniumServerJar是该文件的引用路径,该文件将与package.json文件中的" selenium-standalone-jar":#34; 2.45.0"一起安装。

      最后一步是正确地完成gulp任务,这是我的:

      var angularProtractor = require('gulp-angular-protractor');
          gulp.task('protractor-test', function(callback) {
              gulp
                  .src(['./**/*.js'])  -< 
                  .pipe(angularProtractor({
                      'configFile': 'protractor.conf.js',
                      'debug': true,
                      'autoStartStopServer': true
                  }))
                  .on('error', function(e) {
                      console.log(e);
                  })
                  .on('end', callback);
      
      });
      

      享受!

答案 2 :(得分:3)

您也可以通过添加--suite&#39; args&#39;来运行测试套件。

{!! Form::open(['route' => 'pages.store','files'=>true]) !!}
            @if( isset($languages) && $languages->count() > 0 )
                @foreach($languages as $language)
                    <div class="form-group">
                        {!! Form::label('subject_'.$language->code, 'subject in '.$language->name) !!}
                        <div class="form-line">
                            {!! Form::text('subject_'.$language->code,old('subject'),['class'=>'form-control']) !!}
                        </div>
                    </div>
                    <div class="form-group">
                        <!-- TinyMCE -->
                    {!! Form::textarea('content_'.$language->code,'',['class'=>'tinymce']) !!}
                    <!-- #END# TinyMCE -->
                    </div>
                    @if (!$loop->last)
                        <hr class="style18">
                    @endif
                @endforeach
                <div class="form-group">
                    {!! Form::submit('save change',['class'=>'btn btn-primary']) !!}
                </div>
                {!! Form::close() !!}

答案 3 :(得分:0)

完整的解决方案(与Travis CI合作)

  1. npm配置
  2. 基本上,配置http-server以在运行gulp脚本之前启动。稍后您必须通过npm,fe运行测试。如果您选择其他名称,请npm testnpm run <action>

    "devDependencies": {
      "gulp-angular-protractor": "latest",
      "http-server": "^0.9.0",
      ...
    },
    "scripts": {
      "pretest": "npm install",
      "test": "(npm start > /dev/null &) && (gulp protractor)",
    
      "start": "http-server -a localhost -p 8000 -c-1 ./",
    
      "dev": "(npm start > /dev/null &) && (gulp dev)"
    },
    
    1. 使用gulp
    2. 设置gulp-angular-protractor

      定义您要运行的操作。

      var gulpProtractorAngular = require('gulp-angular-protractor');
      ...
      gulp.task('protractor', function (callback) {
          gulp
              .src('tests/*.js')
              .pipe(gulpProtractorAngular({
                  'configFile': 'protractor.conf.js',
                  'debug': false,
                  'autoStartStopServer': true,
                  'verbose': false,
                  'webDriverUpdate': {
                      'browsers': ['ie', 'chrome']
                  }
              }))
              .on('error', function (e) {
                  console.log(e);
              })
              .on('end', callback);
      });
      

      请参阅GitHub项目中的上述操作: https://github.com/atais/angular-eonasdan-datetimepicker