I'm trying to get rid off the following warning from React:
console.error
Warning: Each child in a list should have a unique "key" prop.
Check the render method of `UsersList`. See https://reactjs.org/link/warning-keys for more information.
at h4
in UsersList (at UsersList.test.jsx:28)
5 |
6 | return (
> 7 | <>
| ^
8 | {props.users.map(user => <h4 className='box title is-4' key={user.id}>{user.username}</h4>)}
9 | </>
10 | )
As you can see unique key is being given to each h4 element.
Why the test runner keeps complaining and pointing at React fragment tag ?
The h4 element doesn't have any children.
Thank you.
Related
So i tried to clone an AG-Grid project from github and
Here are some of the errors that i got
The code below is the output of the browser
TypeError: rowData.forEach is not a function
ClientSideNodeManager.recursiveFunction
D:/A projet web/Ag-Grid proj glob/Github Template/4/agGrid-crudOperation/node_modules/ag-grid-community/dist/ag-grid-community.cjs.js:40217
40214 | return;
40215 | }
40216 | var rowNodes = [];
> 40217 | rowData.forEach(function (dataItem) {
| ^ 40218 | var node = _this.createNode(dataItem, parent, level);
40219 | rowNodes.push(node);
40220 | });
View compiled
ClientSideNodeManager.setRowData
D:/A projet web/Ag-Grid proj glob/Github Template/4/agGrid-crudOperation/node_modules/ag-grid-community/dist/ag-grid-community.cjs.js:40060
40057 | // we add rootNode as the parent, however if using ag-grid-enterprise, the grouping stage
40058 | // sets the parent node on each row (even if we are not grouping). so setting parent node
40059 | // here is for benefit of ag-grid-community users
> 40060 | var result = this.recursiveFunction(rowData, this.rootNode, ClientSideNodeManager.TOP_LEVEL);
| ^ 40061 | if (this.doingLegacyTreeData) {
40062 | this.rootNode.childrenAfterGroup = result;
40063 | this.setLeafChildren(this.rootNode);
Does any one knows the way to fix it or how ?
I am working with typescript react and I need help with how to fix the issue. My constructor object is expecting one of the arguments to be Idl type which is basically a json generated from solana. How do i fix this?
yeah there is a weird thing with TypeScript and the IdlType on args if you look into the IDL object representation.
It is related to this line:
export declare type IdlType = "bool" | "u8" | "i8" | "u16" | "i16" | "u32" | "i32" | "f32" | "u64" | "i64" | "f64" | "u128" | "i128" | "bytes" | "string" | "publicKey" | IdlTypeDefined | IdlTypeOption | IdlTypeCOption | IdlTypeVec | IdlTypeArray;
The way fixed it is by using a workaround:
import YOUR_IDL_JSON_OBJECT from '../config/abiSolana/solanaIDL.json'
const a = JSON.stringify(YOUR_IDL_JSON_OBJECT)
const b = JSON.parse(a)
return new Program(b, address, provider)
When you do this the compiler should not scream at you. If someone cares to explain what the hell is wrong with the enum there, I would be happy. :)
The following error is coming in build time:
src/views/contact-page/contact.page.tsx
Line 25:29: Parsing error: Missing semicolon.
23 | const [test, setTest] = useState<string | null>(null);
24 | setTest("test");
> 25 | const test2: string = test!;
| ^
26 |
Please explain why I could not use not-null assertion operator?
I don't believe this is valid JS (Or typescript) syntax.
const test2: string = test!;
The documentation for TS doesn't list this anywhere as a valid check for null - you can do something like this with objects but I don't believe you can do this for a variable like this.
let s = e!.name; // Assert that e is non-null and access name
Even if that did work, your variable would just be undefined instead of null in the case that test was null.
I am trying to write code for a small utility class that detects change in orientation. Unfortunately, the only way I found to access these fields window.orientation and window.screen.orientation
I can see that window.orientation is deprecated. The alternative I found is the experimental detection api that is not supported on Safari. And so I decided to stick to the deprecated apis for now till I find something better.
Now the other challenge I am facing is whilst mocking access to these readonly field
I am facing a similar problem when trying same approach with window.orientation.
Essentially properties we are trying to alter are readonly properties.
What is the correct approach in this situation?
Note the deprecation warning for window.orientation that I see is present in lib.dom.d.ts
You can use Object.defineProperty() to do this.
E.g.
index.ts:
export function main() {
const orientation = window.screen.orientation;
return orientation.type;
}
index.test.ts:
import { main } from './';
describe('63570675', () => {
it('should pass', () => {
Object.defineProperty(window.screen, 'orientation', {
value: { type: 'landscape-primary' },
});
const actual = main();
expect(actual).toEqual('landscape-primary');
});
});
unit test result with coverage report:
PASS src/stackoverflow/63570675/index.test.ts
63570675
✓ should pass (5ms)
----------|----------|----------|----------|----------|-------------------|
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s |
----------|----------|----------|----------|----------|-------------------|
All files | 100 | 100 | 100 | 100 | |
index.ts | 100 | 100 | 100 | 100 | |
----------|----------|----------|----------|----------|-------------------|
Test Suites: 1 passed, 1 total
Tests: 1 passed, 1 total
Snapshots: 0 total
Time: 5.292s, estimated 14s
source code: https://github.com/mrdulin/jest-codelab/tree/master/src/stackoverflow/63570675
Using
Ruby 1.9.3-p194
Rails 3.2.8
Here's what I need.
Count the different human resources (human_resource_id) and divide this by the total number of assignments (assignment_id).
So, the answer for the dummy-data as given below should be:
1.5 assignments per human resource
But I just don't know where to go anymore.
Here's what I tried:
Table name: Assignments
id | human_resource_id | assignment_id | assignment_start_date | assignment_expected_end_date
80101780 | 20200132 | 80101780 | 2012-10-25 | 2012-10-31
80101300 | 20200132 | 80101300 | 2012-07-07 | 2012-07-31
80101308 | 21100066 | 80101308 | 2012-07-09 | 2012-07-17
At first I need to make a selection for the period I need to 'look' at. This is always from max a year ago.
a = Assignment.find(:all, :conditions => { :assignment_expected_end_date => (DateTime.now - 1.year)..DateTimenow })
=> [
#<Assignment id: 80101780, human_resource_id: "20200132", assignment_id: "80101780", assignment_start_date: "2012-10-25", assignment_expected_end_date: "2012-10-31">,
#<Assignment id: 80101300, human_resource_id: "20200132", assignment_id: "80101300", assignment_start_date: "2012-07-07", assignment_expected_end_date: "2012-07-31">,
#<Assignment id: 80101308, human_resource_id: "21100066", assignment_id: "80101308", assignment_start_date: "2012-07-09", assignment_expected_end_date: "2012-07-17">
]
foo = a.group_by(&:human_resource_id)
Now I got a beautiful 'Array of hash of object' and I just don't know what to do next.
Can someone help me?
You can try to execute the request in SQL :
ActiveRecord::Base.connection.select_value('SELECT count(distinct human_resource_id) / count(distinct assignment_id) AS ratio FROM assignments');
You could do something like
human_resource_count = assignments.collect{|a| a.human_resource_id}.uniq.count
assignment_count = assignments.collect{|a| a.assignment_id}.uniq.count
result = human_resource_count/assignment_count