Как узнать текущий URL-адрес при использовании MemoryRouter

Я пытаюсь понять, как использовать тест, чтобы определить текущий путь к местоположению.

В качестве эксперимента и на основе некоторых документов я написал следующий тест

  test(`Can navigate MemoryRouter`, (done) => {
    const logAll = (p, ...args) => {
      console.info(`SOME OUTPUT`,p, ...args)
      return p.location.pathname
    }

    const div = document.createElement('div')

    const Test = () => (
      <MemoryRouter>
        <React.Fragment>
          <Link to = "/foo/bar" id = "click-me" />
          <Route render = {logAll} />
        </React.Fragment>
      </MemoryRouter>
    )
    ReactDOM.render(React.createElement(Test), div)
    console.info('click')
    Simulate.click(div.querySelector('#click-me'))
  })

Я ожидал, потому что маршрут logAll соответствует всем изменениям, чтобы он регистрировался один раз в / (что он делает), а затем снова в /foo/bar. Но последний никогда не регистрируется до истечения времени тестирования (около 5 секунд).

Что мне не хватает?

вам не хватает звонка done()?

Alex 30.09.2018 20:55

@Alex да, у меня нет вызова done или утверждения, я не ожидаю, что тест пройдет, я ожидаю, что имя пути будет зарегистрировано дважды, это не настоящий тест, просто способ запустить какой-то исследовательский код. Я сейчас не звоню в done, потому что хотел дать достаточно времени для работы навигации, если она будет асинхронной. В настоящее время он регистрируется только один раз до истечения времени ожидания.

George Mauer 01.10.2018 06:13
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
2
2
465
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Ваш тест в порядке (вам даже не нужен done), однако второй аргумент Simulate.click пропущен. Если вы добавите его, он будет работать так, как вы ожидаете:

Simulate.click(
    div.querySelector('#click-me'),
    { button: 0 }
);

Посмотрите, как кодовая база показывает, что Link не выполняет щелчки, в которых нет button=0.

Вина этой линии, показывает, что Linkотслеживает только левая кнопка click.

Ой, черт возьми ... спасибо! Это ... тупо ... почему бы не по умолчанию?

George Mauer 03.10.2018 00:27

Ага, непонятно ... Проверил имитация ферментов - работает точно так же. Может подсказать? Но я думаю, они откажутся, так как это может иметь плохой побочный эффект. Вы можете определить что-то вроде помощника-обертки SimulateLeftClick.click() в своем тесте, чтобы справиться с этим.

Alex 03.10.2018 04:53

Другие вопросы по теме