how to get the text of anchor tag in jest

user_10627917 0
Viewed 1632
  <a href={LinkMappingUtility.getMappedWebUiLink('/#/dashboard')}
    data-id="0"
    className="nav-menu-item"
    autoFocus="true">

  {menuItem({ linkTitle: translate('sbDashboard', currentLanguage), icon: 'swn-home-icon' })}

this is the anchor tag inside that i have menu item text and i want the text in enzyme

My Code is :

test('all menu items display the correct text', () => {

    const allMenuItemText = [
        { linkTitle: 'Dashboard', icon: 'swn-home-icon' },
        { linkTitle: 'Alerts', icon: 'swn-alerts-icon' },
        { linkTitle: 'Contact Management', icon: 'swn-home-icon'},
        { linkTitle: 'Reporting', icon: 'swn-home-icon' },
        { linkTitle: 'Solutions', icon: 'swn-home-icon' },
        { linkTitle: 'Integrations', icon: 'swn-home-icon' },
        { linkTitle: 'Account Settings', icon: 'swn-home-icon'},
        { linkTitle: 'Support & Training', icon: 'swn-home-icon' }           
    ];

    wrapper.find('.nav-menu-item').forEach((node, index) => {            
        expect(node.text()).toEqual(allMenuItemText[index].linkTitle);       
    })

output : here i am getting the empty string in return

enzyme jestjs reactjs javascript
2 Answers

I'm guessing just a typo, you meant to use a class selector?

// tag selector
wrapper.find('nav-menu-item') ...

// class selector
wrapper.find('.nav-menu-item') ...
user_32949440

Have you tried selecting the link title - the anchor tag is difficult to select in the testing library - so if you select the link title you are clicking it may work

const anchorTag = wrapper.find("my-link-title");
expect(anchorTag).toHaveAttribute("href", "https://url-test-1#");
user_108841050
Related