Как динамически загружать различные объекты страницы в nightwatch на основе тестовой среды?

#javascript #nightwatch.js #e2e-testing

#javascript #nightwatch.js #e2e-тестирование

Вопрос:

Я хочу добавить тест для своего приложения, который предполагает получение оплаты. В локальной среде my apps используется страница оплаты с заглушкой, где вам нужно только нажать кнопку, чтобы выполнить сбой или авторизовать платеж, во всех других средах отображается форма, в которой необходимо заполнить данные карты.

В настоящее время у меня есть тестовая настройка, чтобы проверить, нужно ли нам использовать реальный или заглушенный платеж в каждой команде.

 function isRealPayment(page) {
  return !page.api.globals.stubbedPayment;
}

module.exports = {
  commands: {
    verifyLoaded: function() {
      if (isRealPayment(this)) {
        return this.waitForElementVisible('@orderSummaryContainer');
      }
      return this.waitForElementVisible('@stubbedAuthorisedForm');
    },

    fillInPaymentDetails: function() {
      if (isRealPayment(this)) {
        this
          .setValue('@cardNumber', '4444333322221111')
          .setValue('@name', 'John Doe')
          .setValue('@expiryMonth', '12')
          .setValue('@expiryYear', '25')
          .setValue('@securityCode', '123');
      }
    },

    submitPayment: function() {
      if (isRealPayment(this)) {
        return this.click('@submitButton');
      }
      return this.click('@stubbedSubmitButton');
    }
  },

  elements: {
    orderSummaryContainer: '#orderSummaryDetailsTop',
    cardNumber: '#cardNumber',
    name: '#cardholderName',
    expiryMonth: '#expiryMonth',
    expiryYear: '#expiryYear',
    securityCode: '#securityCode',
    submitButton: '#submitButton',

    stubbedAuthorisedForm: '.frm-AUTHORISED',
    stubbedSubmitButton: '.frm-AUTHORISED > input[type="submit"]'
  }
};
  

Я бы предпочел, чтобы я мог определить два разных объекта страницы и выбрать, какой из них экспортировать на основе stubbedPayment глобального.
например

 let realPaymentPage = {
  commands: {
    verifyLoaded: function() {
      return this.waitForElementVisible('@orderSummaryContainer');
    },

    fillInPaymentDetails: function() {
      this
        .setValue('@cardNumber', '4444333322221111')
        .setValue('@name', 'John Doe')
        .setValue('@expiryMonth', '12')
        .setValue('@expiryYear', '25')
        .setValue('@securityCode', '123');
    },

    submitPayment: function() {
      return this.click('@submitButton');
    }
  },

  elements: {
    orderSummaryContainer: '#orderSummaryDetailsTop',
    cardNumber: '#cardNumber',
    name: '#cardholderName',
    expiryMonth: '#expiryMonth',
    expiryYear: '#expiryYear',
    securityCode: '#securityCode',
    submitButton: '#submitButton'
  }
};

let stubbedPaymentPage = {
  commands: {
    verifyLoaded: function() {
      return this.waitForElementVisible('@authorisedForm');
    },

    fillInPaymentDetails: function() {
      // Do nothing
    },

    submitPayment: function() {
      return this.click('@submitButton');
    }
  },

  elements: {
    authorisedForm: '.frm-AUTHORISED',
    submitButton: '.frm-AUTHORISED > input[type="submit"]'
  }
};

if (browser.globals.stubbedPayment) {
  module.exports = stubbedPaymentPage;
} else {
  module.exports = realPaymentPage;
}
  

Но я не могу найти способ получить доступ к глобальным переменным, когда их нет в команде страницы. Возможно ли это? Или есть другой способ загрузить другой объект страницы на основе тестовой среды?

Ответ №1:

Конечно, да. пример решения:

Сначала давайте создадим Global.js файл.

Добавьте путь к файлу внутри nightwatch.json:

 "globals_path": "Global.js"
  

В Global.js метод define before (он выполняется один раз перед любым из тестов):

 var self = module.exports = {
    environment: undefined,
    before: function (done) {
       // parseArgumentsAndGetEnv is function you need to implement on your own to find your env param
        self.environment = parseArgumentsAndGetEnv(process.argv);
        console.log("Run against: "   self.environment);

        done();
    }
};
  

Теперь в тестах вы можете использовать эту переменную:

 if (browser.globals.environment == 'Test') {
   // do something
} else if (browser.globals.environment == 'Prod') {
  // do something else
}