javascript-Testcafe LocalStorage问题

2019-12-11 02:35:12 阅读：370 来源： 互联网

标签：testcafe reactjs facebook local-storage javascript

大家！
我是TestCafe的新手,我需要一些想要实现的帮助.

我有一个React网站,我在上面放置了一个Facebook登录名.通常,当您进入页面并单击“使用Facebook登录”时,会打开一个弹出窗口并正常输入您的凭据.之后,您将被重定向到页面,令牌被保存在localStorage变量中,供页面稍后使用.

但是,当我运行登录过程测试时,Testcafe而不是打开弹出窗口,而是在同一页面上打开Facebook表单,并且从不重定向到该页面.

另外,我尝试使用ClientFunction(以及Roles)在localstorage上设置一些虚拟令牌,但我的网站永远无法到达该令牌,因为testcafe似乎将此变量放在了称为Hammerhead的键上

因此,我的问题是,如何在测试中或手动输入此令牌,以便我的网站可以读取它并进行一些功能？

到目前为止,这就是我所拥有的.

/* global test, fixture */
import { WelcomePage } from './pages/welcome-page'
import {ClientFunction, Role} from 'testcafe';

const welcomePage = new WelcomePage()

const setLocalStorageItem = ClientFunction((prop, value) => {
  localStorage.setItem(prop, value);
});

const facebookAccUser = Role(`https//mypage.net/`, async t => {
  await setLocalStorageItem('token', 'my-token');
}, { preserveUrl: true });

fixture`Check certain elements`.page(`https//mypage.net/`)
test('Check element is there', async (t) => {
  await t
    .navigateTo(`https//mypage.net/`)
    .wait(4000)
    .useRole(facebookAccUser)
    .expect(cetainElementIfLoggedIn)
    .eql(certainValue)
    .wait(10000)
})

任何帮助将不胜感激

谢谢你的时间.

解决方法:

当前,TestCafe不支持多个浏览器窗口.因此,无法通过Facebook弹出表单登录.
但是,有一种解决方法.请参考以下线程https://github.com/DevExpress/testcafe-hammerhead/issues/1428.

我的工作测试如下所示：

import { Selector, ClientFunction } from 'testcafe';

const patchAuth = ClientFunction(() => {
    window['op' + 'en'] = function (url) {
        var iframe = document.createElement('iframe');

        iframe.style.position = 'fixed';
        iframe.style.left = '200px';
        iframe.style.top = '150px';
        iframe.style.width = '400px';
        iframe.style.height = '300px';
        iframe.style['z-index'] = '99999999';
        iframe.src = url;
        iframe.id = 'auth-iframe';

        document.body.appendChild(iframe);
    };
});

fixture `fixture`
    .page `https://www.soudfa.com/signup`;

test('test', async t => {
    await patchAuth();

    await t
        .click('button.facebook')
        .switchToIframe('#auth-iframe')
        .typeText('#email', '****')
        .typeText('#pass', '****')
        .click('#u_0_0')
        .wait(30e3);
});

请记住,需要使用testcafe-hammerhead模块中的x-frame-options进行操作.

另外,我想提及的是,在多个浏览器窗口中进行测试是我们的优先任务之一,它是TestCafe Roadmap的一部分

标签：testcafe,reactjs,facebook,local-storage,javascript
来源： https://codeday.me/bug/20191211/2105821.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript-Testcafe LocalStorage问题