गैर एंगुलरज वेबसाइट पर प्रोट्रैक्टर का उपयोग कैसे करें?

Question

मुझे प्रोटेक्टर फ्रेमवर्क मिला है जो एंगुलरजेएस वेब अनुप्रयोगों के लिए बना है।

मैं एक वेबसाइट पर प्रोट्रैक्टर का उपयोग कैसे कर सकता हूं जो AngularJS का उपयोग नहीं कर रहा है?

मैंने अपना पहला परीक्षण लिखा और प्रोटेक्टर ने इस संदेश को ट्रिगर किया:

Error: Angular could not be found on the page https://www.stratexapp.com/ : retries looking for angular exceeded

Answer 1

यदि आपके परीक्षण को एक गैर-कोणीय पृष्ठ के साथ सहभागिता करने की आवश्यकता है, तो सीधे वेबड्राइवर उदाहरण तक पहुंचें browser.driver।

उदाहरण प्रोट्रेक्टर डॉक्स से

browser.driver.get('http://localhost:8000/login.html');

browser.driver.findElement(by.id('username')).sendKeys('Jane');
browser.driver.findElement(by.id('password')).sendKeys('1234');
browser.driver.findElement(by.id('clickme')).click();

Comments

सिर्फ एक मूर्खतापूर्ण सवाल, by.idबदल गया है By.id?

— वैल

@Val - global.by = global.By = protractor.By; (स्रोत - github.com/angular/protractor/commit/… )

— इटन पीयर

गैर कोणीय साइटों के वर्ग और अन्य साधनों द्वारा तत्व कैसे खोजें?

— ईस्वरमूर्ति के

@EaswaramoorthyK by.className। डॉक्स का

— मुरली केजी

Answer 2

एक और तरीका यह है browser.ignoreSynchronization = true कि ब्राउजर से पहले सेट करें । (...)। प्रोट्रैक्टर कोणीय लोड के लिए इंतजार नहीं करेगा और आप सामान्य तत्व (...) सिंटैक्स का उपयोग कर सकते हैं।

browser.ignoreSynchronization = true;
browser.get('http://localhost:8000/login.html');

element(by.id('username')).sendKeys('Jane');
element(by.id('password')).sendKeys('1234');
element(by.id('clickme')).click();

Comments

मुझे टेस्ट सूट के अनुरूप कोड रखने के लिए यह तरीका पसंद आया।

— आनंद

यह गैर-कोणीय पर प्रोट्रैक्टर से निपटने के दौरान निश्चित रूप से सबसे अच्छा तरीका है। इस पर एक ब्लॉग पोस्ट है जिसमें कुछ और चीजें बताई गई हैं। E2E के लिए उन से खोजने के लिए, वहाँ भी है nightwatch.js , प्रशिक्षु , casperjs , webdriver

— सिरो कोस्टा

@Andrei पेजऑबजेक्ट के बारे में कैसे। जब मैं तत्वों को कार्यात्मक ब्लॉक की ओर घोषित करता हूं और इसे चलाने की कोशिश कर रहा हूं तो मुझे NoSuchElementError कोड स्निपेट दिखाई दे रहा है: this.buttonOnLeftSide = browser.driver.findElement (by.className ('leftbutton')); this.iframe = 'emulatorFrame'; this.clickPlusSignOnTemplateEditor = function () {browser.driver.ignoreSynchron = = true; console.log ( 'हे'); browser.driver.switchTo () फ्रेम (this.iframe)। कंसोल.लॉग ('iframe के अंदर'); browser.sleep (3000); buttonOnLeftSide.click (); };

— निक

बस इसे यहाँ डाल दो अगर किसी को मेरी तरह एक ही मुद्दा हो। कृपया इस दृष्टिकोण से अवगत रहें, यह अच्छा है लेकिन यदि आप तेजी से असफल होना चाहते हैं । आप परीक्षण हमेशा किसी न किसी मामले / वातावरण में चला सकते हैं, हालांकि परीक्षण विफल होते हैं।

— लिन फाम

मेरे द्वारा सबमिट बटन पर क्लिक करने के बाद jasmine.DEFAULT_TIMEOUT_INTERVAL होने पर। कोई उपाय?

— जी-रूह

Answer 3

WaitForAngular का उपयोग अब हटाए गए अनदेखा किए जाने वाले Synchronization गुण के बजाय किया जाना चाहिए।

निम्नलिखित WaitForAngular मार्गदर्शन प्रोटेक्टर डॉक्स से टाइमआउट के लिए लिया गया है:

कोणीय की प्रतीक्षा में अक्षम कैसे करें

यदि आपको ऐसे पृष्ठ पर नेविगेट करने की आवश्यकता है, जो कोणीय का उपयोग नहीं करता है, तो आप `browser.waitForAngularEnabled (गलत) सेटिंग द्वारा कोणीय की प्रतीक्षा करना बंद कर सकते हैं। उदाहरण के लिए:

browser.waitForAngularEnabled(false);
browser.get('/non-angular-login-page.html');

element(by.id('username')).sendKeys('Jane');
element(by.id('password')).sendKeys('1234');
element(by.id('clickme')).click();

browser.waitForAngularEnabled(true);
browser.get('/page-containing-angular.html');

Comments

इसका व्यवहार छोटी गाड़ी है

— मुनीम हबीब

Answer 4

गैर कोणीय साइट पर परीक्षण करने के लिए, आपको सिंक्रनाइज़ेशन को हटा देना चाहिए। इसके लिए निम्नलिखित का उपयोग करें:

browser.ignoreSynchronisation = true;
browser.get('url');

Answer 5

कुछ अवसरों में, त्रुटियों से बचने के लिए दोनों मूल्यों को जोड़ने की आवश्यकता होती है।

 browser.driver.ignoreSynchronization = true;
 browser.waitForAngularEnabled(false); 

आप उन्हें spec.js फ़ाइल में जोड़ सकते हैं।

describe('My first non angular class', function() {
    it ('My function', function() {
        browser.driver.ignoreSynchronization = true;
        browser.waitForAngularEnabled(false);

या @ मृदुल सुझाव के रूप में, उन्हें config.js फ़ाइल में जोड़ें।

Export.config = {directConnect: true, फ्रेमवर्क: 'चमेली',

  onPrepare: function () {
         browser.driver.ignoreSynchronization = true;// for non-angular set true. default value is false 
         browser.waitForAngularEnabled(false);   // for non-angular set false. default value is true  
       },

Comments

दूसरे दृष्टिकोण में मान लें कि आपके पास केवल कोणीय स्क्रिप्ट नहीं है।

— समीरा दे सिल्वा

Answer 6

व्यक्तिगत रूप से, मुझे प्रस्तावित समाधानों के साथ कोई सफलता नहीं मिली क्योंकि डोम तत्व समय पर ठीक से लोड नहीं किए गए थे।

मैंने उस अतुल्यकालिक व्यवहार को संभालने के कई तरीके आज़माए, जिसमें browser.wait with browser.isElementPresent शामिल है, लेकिन उनमें से कोई भी संतोषजनक नहीं था।

क्या चाल का उपयोग किया है प्रोट्रैक्टर ऑनप्रेम में अपने तरीकों से दिए गए वादे लौटाता है:

onPrepare: () => {

    browser.manage().window().maximize();

    browser.waitForAngularEnabled(true).then(function () {
        return browser.driver.get(baseUrl + '/auth/');
    }).then(function () {
        return browser.driver.findElement(by.name('login')).sendKeys('login');
    }).then(function () {
        return browser.driver.findElement(by.name('password')).sendKeys('password');
    }).then(function () {
        return browser.driver.findElement(by.name('submit')).click();
    }).then(function () {
        return true;
    });

    return browser.driver.wait(function () {
        return browser.driver.getCurrentUrl().then(function (url) {
            return /application/.test(url);
        });
    }, 10000);
},

मैं https://github.com/angular/protractor/blob/master/spec/withLoginConf.js से प्रेरित था

Comments

क्या यह सही होने के बजाय ब्राउज़र .waitForAngularEnabled (गलत) नहीं होना चाहिए?

— onuliz

Answer 7

अपने .js कल्पना फ़ाइल में नीचे स्निपेट जोड़ें

beforeAll(function() {
    browser.waitForAngularEnabled(false);
});

Answer 8

Conf.js फ़ाइल में कोड का निम्नलिखित टुकड़ा जोड़ें

   onPrepare: function () {
       browser.ignoreSynchronization = true;      
   }

Answer 9

गैर कोणीय अनुप्रयोगों के लिए नीचे स्निपेट जोड़ें:

app- browser.ignoreSynchronization = true;

Answer 10

गैर-कोणीय अनुप्रयोगों के लिए अपने config.js फ़ाइल में नीचे स्निपेट का उपयोग करें-

browser.ignoreSynchronization = true;

और कोणीय आवेदन के लिए -

browser.ignoreSynchronization = false;

Answer 11

मैं aurelia वेब-ऐप पर काम कर रहा हूं जो कि Angular, React के समान FE फ्रेमवर्क है। इसमें मैं स्वचालन के लिए प्रोट्रैक्टर का उपयोग कर रहा हूं।

टेक स्टैक मेरी कौन सी परियोजना: -

• चांदा
• टाइपप्रति
• पेज ऑब्जेक्ट मोडल
• खीरा
• चाय
• नोड
• NPM
• वीएस कोड (आईडीई)

मुख्य परिवर्तन केवल कॉन्फ़िगरेशन फ़ाइल में होता है, मैं जीथब में कोड जोड़ सकता हूं यदि वह मदद करेगा, तो यहां वह कॉन्फ़िगरेशन फ़ाइल है जो मैं अपने प्रोजेक्ट में उपयोग कर रहा हूं जो मेरे लिए एकदम सही काम करता है। कुछ ब्लॉगों के साथ-साथ मेरे वर्डप्रेस में भी पोस्ट करें , आशा है कि मदद मिल सकती है।

const reporter = require('cucumber-html-reporter');
exports.config = {
    SELENIUM_PROMISE_MANAGER: false,
    directConnect: true,
    specs: ["./e2e/features/*/EndToEnd.feature"],
    format: 'json:cucumberReport.json',
    framework: 'custom',
    frameworkPath: require.resolve('protractor-cucumber-framework'),
    cucumberOpts: {
        strict: true,
        format: 'json:cucumberReport.json',
        keepAlive: false,
        require: [
            './e2e/hooks/*.ts',
            './e2e/stepDefinition/*/*.ts',
        ],
       tags: '@Regression'
    },
    beforeLaunch: function () {
        require('ts-node/register')
    },
    onPrepare: async () => {
        await browser.waitForAngularEnabled(false);
        await browser.ignoreSynchronization == true;
        await browser.manage().window().maximize();
        await browser.manage().timeouts().implicitlyWait(10000);
     },
    onComplete: async () => {
         var options = {
            theme: 'bootstrap',
            jsonFile: './reports/cucumberReport.json',
            output: './reports/cucumberReport.html',
            reportSuiteAsScenarios: true,
            launchReport: false,
            screenshotsDirectory: './reports/screenshots',
            storeScreenshots: true,
            metadata: {
                "Test Environment": "SAND-DEV-1",
                "Platform": "Windows 10",
            }
        };
        reporter.generate(options);
    },
};

Answer 12

प्रोट्रैक्टर के बजाय, आप टेस्ट कैफे के ई 2 ई परीक्षण के लिए उपयोग कर सकते हैं ।
पेशेवरों:

• ES2016 सिंटैक्स
• कोई अतिरिक्त निर्भरता, कॉन्फ़िगरेशन और ब्राउज़र प्लगइन्स की आवश्यकता नहीं है
• लचीला चयनकर्ता
• आसान सेटअप

Comments

प्रिय @mlosev, यह सीधे सवाल का जवाब नहीं देता है। सवाल यह है कि "रक्षक का उपयोग कैसे करें ..." और नहीं "मुझे संरक्षक के बजाय किस पुस्तकालय का उपयोग करना चाहिए" :-)

— अब्देलक्रीम