Wrapper.find not finding class

This is my component:

const User = ({ users }) => (
  <div className="displayContainer">
    {users &&
     users.length > 0 &&
     users[0].username ?
     <div className="userOnShow">
       <img className="userImage"alt="no image yet"/>
       <div>{users[0].username}, {users[0].age}</div>
     </div>
     :
     <div className="noOneLeft">
      {'Sorry, no new people in your area'}
     </div>
    }
  </div>
)

I have 2 questions. what sort of things should I test? i.e. just that it renders certain classes etc?

I'm assuming testing the ternary would be an integration test?

also and my main question, when i do:

describe.only('DisplayingUser', () => {
  let wrapper;
  const usersStub = {remainingUsers: []}
  it('expects the props to be correct', () => {
    wrapper = shallow(
      <User
        users={usersStub}
      />
    )
    const userClass = wrapper.find('.userOnShow')
    console.log(userClass, 'uc');
    expect(userClass.length).to.equal(1)
  });
})

it fails saying expected 0 to equal 1, i.e. it hasn't found my class, but clearly its there?