我正在使用 Jest 和 Enzyme 来测试 React 功能组件。
我的组件:
export const getGroups = async () => {
const data = await fetch(groupApiUrl);
return await data.json()
};
export default function MyWidget({
groupId,
}) {
// Store group object in state
const [group, setGroup] = useState(null);
// Retrive groups on load
useEffect(() => {
if (groupId && group === null) {
const runEffect = async () => {
const { groups } = await getGroups();
const groupData = groups.find(
g => g.name === …Run Code Online (Sandbox Code Playgroud) 我正在尝试进行项目范围的搜索和替换
从:
drivers[i].findElement(By.id("elementID")).click();
Run Code Online (Sandbox Code Playgroud)
至:
findAndClick(driver[i], "elementID", true)
Run Code Online (Sandbox Code Playgroud)
问题是elementID可以是任何东西所以我试图通配符搜索并替换为通配符中的内容?
我有一个数组,一个包含所有具有唯一ID的用户的列表.我有一个包含所选组信息的对象.部分信息是所有者ID.我想知道,如何根据群组所有者ID获取用户的信息?例如,学生组对象的所有者ID为70,我的网站上有一个用户ID为70的用户...如何匹配它们?
users:
[ {
id: 68
name: mike
domain: i:0#.f|admembers|mike.ca
email: mike.ca
isAdmin: False
}, etc etc ]
selectedGroup: {
name: Students
id: 78
description:
owner: 70
ownerIsUser: True
}
Run Code Online (Sandbox Code Playgroud) 我有两个数组,只包含组的对象.一个包含我网站上的所有组.另一个包含特定用户所属的所有组.
我想减去:All the groups- user groups =groups remaining
我正在使用AngularJS,我不确定这里是否有帮助(可能会使用过滤器).
我查看了之前的问题并遇到了一些选择:
这些是我试过的:
$scope.availableGroups = $($scope.groups).not($scope.assignedGroups).get();
$scope.availableGroups = $.grep($scope.groups,function(x) {return $.inArray(x, $scope.assignedGroups) < 0})
Run Code Online (Sandbox Code Playgroud)
这是一个数组:
assignedGroups:
[{
id: 115,
name: 'Test Group 2',
Description: '',
owner: 10,
OwnerIsUser: false,
}, {
id: 116,
name: 'Test Group 3',
Description: '',
owner: 71,
OwnerIsUser: false,
}, {
id: 117,
name: 'Test Group 4',
Description: '',
owner: 71,
OwnerIsUser: false,
}, {
id: 118,
name: 'Test Group 5',
Description: '',
owner: 115, …Run Code Online (Sandbox Code Playgroud) 我有两个问题.只要将轨道标记放在我的视频元素中,就会显示视频的默认控制器.我有自定义控件,所以这是一个很大的问题.
第二.我无法找到一种关闭关闭字幕的方法.
HTML:
<video id="trailers" poster="images/poster/poster.jpg">
<source src="media/vLast.mp4" type="video/mp4">
<source src="media/vLast.webm" type="video/webm">
<track id="mytrack" label="English Subtitles" src="subtitles.vtt" srclang="en" default />
</video>
<button id="cc">CC</button>
Run Code Online (Sandbox Code Playgroud)
JS:
var cc = document.getElementById('cc');
function cc(){
var video= document.getElementById('media');
var track1 = video.textTracks[0];
var mytrack = document.getElementById('mytrack');
var track2 = mytrack.track;
console.log(track1);
console.log(track2);
}
cc.addEventListener('click',cc,false);
Run Code Online (Sandbox Code Playgroud) 我正在尝试模拟一个函数,但不确定我在这里做错了什么。我有这个功能“getGroups”
获取组:
export const getGroups = async () => {
try {
const groupApiUrl = getDashboardPath(GROUPS_TAB_INDEX);
const data = await fetch(groupApiUrl, { cache: 'force-cache' });
const userData = await data.json();
return userData;
} catch (error) {
throw Error(error);
}
};
Run Code Online (Sandbox Code Playgroud)
___mocks___/getGroups.js:
export default async () => {
return {
groups: [
{ id: 1, name: 'Data1' },
{ id: 2, name: 'Data2' }
]
};
};
Run Code Online (Sandbox Code Playgroud)
getGroups.test.js:
jest.mock('./getGroups.js');
// eslint-disable-next-line import/first
import { getGroups } from './getGroups';
const fakeRespose = …Run Code Online (Sandbox Code Playgroud) 尝试设置通用 UI 库时遇到很多麻烦。
我已经设置了一个如下所示的纱线工作区:
/monorepo
/common-16.13
/react-app-16.8.
/another-app-16.13
Run Code Online (Sandbox Code Playgroud)
然后我导入common-16.13到react-app-16.8和使用这样的组件之一:
/react-app/home.js
import {SharedComponent} from "common"
Run Code Online (Sandbox Code Playgroud)
但是,当我运行该应用程序时,出现此错误:
react.development.js?80c6:1465 Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of …Run Code Online (Sandbox Code Playgroud) 我在AngularJS中有一个表单视图,我使用Angular-ui中的一个模态来显示我的表单.功能方面,一切都很好,但是,当我关闭表单时,如果表单无效,则显示验证弹出窗口.
这就是它的样子:

当表单打开时,弹出窗口根本不显示,但只有当我单击取消并且它开始消失时才会显示.
HMTL:
<form name='newGroupForm'>
<div class="modal-body">
<label for="groupName">Group Name:
<input id="groupName" type="text" ng-model='newGroup.name' required>
</label>
<br/>
<label for="groupDesc">Group Description:
<input id="groupDesc" type="text" ng-model='newGroup.desc'>
</label>
<br/>
<label for="groupOwner">Group Name:
<select id="groupOwner" type="text" ></select>
</label>
</div>
<div class="modal-footer">
<button class="btn btn-warning" ng-click="cancel()">Cancel</button>
<button class="btn btn-primary" type="button" ng-click="submit()" ng-disabled="newGroupForm.$invalid">Create</button>
</div>
</form>
Run Code Online (Sandbox Code Playgroud)
模态控制器:
spApp.controller('newGroupCtrl',
function newGroupCtrl($scope, $modalInstance, groupService){
$scope.newGroup = {
name:null,
desc: null
};
$scope.submit = function(){
$modalInstance.close($scope.newGroup);
}
$scope.cancel = function (){
$modalInstance.dismiss('Cancelled group creation');
};
}
);
Run Code Online (Sandbox Code Playgroud) validation twitter-bootstrap angularjs angular-ui angular-ui-bootstrap
我写了一个调用 apollo 的钩子useQuery。这很简单:
使用决策者:
import { useState } from 'react';
import { useQuery, gql } from '@apollo/client';
export const GET_DECIDER = gql`
query GetDecider($name: [String]!) {
deciders(names: $name) {
decision
name
value
}
}
`;
export const useDecider = name => {
const [enabled, setEnabled] = useState(false);
useQuery(GET_DECIDER, {
variables: {
name
},
onCompleted: data => {
const decision = data?.deciders[0]?.decision;
setEnabled(decision);
},
onError: error => {
return error;
}
});
return {
enabled
};
};
Run Code Online (Sandbox Code Playgroud)
我现在正在尝试测试它,但MockedProvider …
javascript ×8
reactjs ×4
angularjs ×2
arrays ×2
jestjs ×2
angular-ui ×1
apollo ×1
azure ×1
babel-loader ×1
enzyme ×1
html ×1
html5 ×1
html5-video ×1
jquery ×1
loops ×1
react-apollo ×1
react-hooks ×1
regex ×1
validation ×1
webpack ×1