टाइप एरर: अपरिभाषित

Question

की संपत्ति 'बराबर' नहीं पढ़ सकता है मैं डीओएम नोड्स पर जोर देने के लिए enzyme का उपयोग करने का प्रयास कर रहा हूं। मेरे Component दिखता

import React, {Component} from 'react'; 
import TransactionListRow from './TransactionListRow'; 
import {Table, TableBody, TableHeader, TableHeaderColumn, TableRow} from 'material-ui/Table'; 

export default class TransactionList extends Component { 
    render() { 
    const { transactions } = this.props; 

    return (
     <Table> 
     <TableHeader displaySelectAll={false}> 
      <TableRow> 
      <TableHeaderColumn>Name</TableHeaderColumn> 
      <TableHeaderColumn>Amount</TableHeaderColumn> 
      <TableHeaderColumn>Transaction</TableHeaderColumn> 
      <TableHeaderColumn>Category</TableHeaderColumn> 
      </TableRow> 
     </TableHeader> 
     <TableBody> 
      {transactions.map(transaction => 
      <TransactionListRow key={transaction.id} transaction={transaction}/> 
     )} 
     </TableBody> 
     </Table> 
    ); 
    } 
}; 

की तरह मेरे test लग रहा है

तरह

import expect from 'expect'; 
import React from 'react'; 
import {mount} from 'enzyme'; 
import TransactionList from '../TransactionList'; 
import {TableHeaderColumn} from 'material-ui/Table'; 
import getMuiTheme from 'material-ui/styles/getMuiTheme'; 

describe("<TransactionList />",() => { 
    const mountWithContext = (node) => mount(node, { 
    context: { 
     muiTheme: getMuiTheme(), 
    }, 
    childContextTypes: { 
     muiTheme: React.PropTypes.object.isRequired, 
    } 
    }); 


    it('renders five <TableHeaderColumn /> components',() => { 
    const wrapper = mountWithContext(<TransactionList transactions={[]}/>) 

    console.log(wrapper.html()); 
    // expect(wrapper.find('thead').length).toBe(1); 
    expect(wrapper.contains(<TableHeaderColumn>Name</TableHeaderColumn>)).to.equal(true) 
    }); 
}); 

जब मैं इस चलाने के लिए, मैं

● <TransactionList /> › renders five <TableHeaderColumn /> components 

    TypeError: Cannot read property 'equal' of undefined 

     at Object.<anonymous> (src/components/transactions/__tests__/TransactionList.test.js:24:250) 
     at process._tickCallback (internal/process/next_tick.js:103:7) 

प्रति Enzymedocs के रूप में मिलता है,

.contains() expects a ReactElement, not a selector (like many other methods). Make sure that when you are calling it you are calling it with a ReactElement or a JSX expression.

मैं क्या गलत कर रहा हूँ?

धन्यवाद

अद्यतन
मैं import expect from 'expect हटा दिया और

import React from 'react'; 
import {mount} from 'enzyme'; 
import TransactionList from '../TransactionList'; 
import TableHeaderColumn from 'material-ui/Table'; 
import getMuiTheme from 'material-ui/styles/getMuiTheme'; 

describe("<TransactionList />",() => { 
    const mountWithContext = (node) => mount(node, { 
    context: { 
     muiTheme: getMuiTheme(), 
    }, 
    childContextTypes: { 
     muiTheme: React.PropTypes.object.isRequired, 
    } 
    }); 


    it('renders five <TableHeaderColumn /> components',() => { 
    const wrapper = mountWithContext(<TransactionList transactions={[]}/>) 

    // console.log(wrapper.html()); 
    expect(wrapper.find('thead').length).toBe(1); 
    expect(wrapper.find('td').length).toBe(0); 

    // this is not working 
    expect(wrapper.contains(<TableHeaderColumn/>)).toEqual(true); 
    }); 
}); 

के रूप में यह भाग गया यह

FAIL src/components/transactions/__tests__/TransactionList.test.js 
    ● <TransactionList /> › renders five <TableHeaderColumn /> components 

    expect(received).toEqual(expected) 

    Expected value to equal: 
     true 
    Received: 
     false 

     at Object.<anonymous> (src/components/transactions/__tests__/TransactionList.test.js:26:164) 

साथ और साथ अब विफल रहता है

expect(wrapper.contains(<TableHeaderColumn/>)).to.equal(true); 

मैं

 Warning: Unknown props `onMouseEnter`, `onMouseLeave`, `onClick` on <th> tag. Remove these props from the element. 
FAIL src/components/transactions/__tests__/TransactionList.test.js 
    ● <TransactionList /> › renders five <TableHeaderColumn /> components 

    TypeError: Cannot read property 'equal' of undefined 

     at Object.<anonymous> (src/components/transactions/__tests__/TransactionList.test.js:26:166) 
     at process._tickCallback (internal/process/next_tick.js:103:7) 

मैं अभी भी ReactElement

Answer 1

एक Enzyme समस्या नहीं है यही कारण है कि पर जोर नहीं कर सकते हैं।

expect(...).toundefined क्योंकि आप expect.js स्थापित किया है और आप chai सिंटैक्स का उपयोग कर रहे हैं।

इस

expect(wrapper.contains(<TableHeaderColumn>Name</TableHeaderColumn>)).to.equal(true) 

होना चाहिए

expect(wrapper.contains(<TableHeaderColumn>Name</TableHeaderColumn>)).toEqual(true)