Javid Asgarov

Это вообще по js коду, чем чисто к реакту.

switch(curr){
      case "eur":
        newCurrency = {...this.state.currencyData, rub: false, usd: false, eur: true };
        break
      case "usd":
        newCurrency = {...this.state.currencyData, rub: false, usd: true, eur: false };
        break
      default:
        newCurrency = {...this.state.currencyData, rub: true, usd: false, eur: false };
        break
      }

А если будет еще валюта, будете еще свойства добавлять? Лучше держать свойство currency и от него отталкиваться. Был бы typescript, еще б указали какие строки туда можно куда присваивать. Причем в state currency уже есть, зачем currencyData я не понял.

Тоже самое со всеми stop свойствами, их много, трудно понять, что к чему. В общем, посмотрите на это в первую очередь.

Я отвечу в тех рамках, с которыми я знаком, как я тестирую и вижу это. Тестировать смысла нет методы в реакт компоненте. Я думаю подходить к этому, тестировать то как класс будет использоваться. Если этот метод отдельно будет где-то пользоваться, то надо подумать о его тестировании, если нет, то его предназначение как компонента эта функция render.

Для этого есть библиотеки как react-testing-library (про нее и на хабре была статья), а также Enzyme. Суть, что вы рендерите ваш компонент в тесте и смотрите, чтобы он давал правильные результаты. А что он делает внутри, это уже дело компонента.

С помощью coverage jest сможете посмотреть, какие методы были задействованы при условиях вашего теста. Например, если метод вызывается после клика на каком-то элементе внутри компонента, то можно использовать соответствующий триггер в тесте и "кликнуть" туда и убедиться, что нужные изменения произошли.

Если же этот метод делает какую-то важную логику, то возможно стоит переопределить его вне сущности реакта, создать отдельный класс или функцию и тестировать отдельно ее.

Не очень пониманию, что надо. Но у react есть lifecycle methods, среди componentsWillReceiveProps(nextProps). В этом методе можно смотреть на props, которые пришли. Согласно какой-то логике что-то менять в state или ничего не делать, вследствие изменения состояния компонента он заново отрендерится, если что.

Судя по package.json это последняя версия webpack, и в их документации немного по-другому все это дело указывается. Может проблема в этом, попробуйте как указано в документации:

module: {
  rules: [
    {
      test: /\.js$/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['env']
        }
      }
    }
  ]
}

В вашей ссылки JS кода нет, но я б предложил использовать ref (посмотрите документацию), а также поместить этот код в componentDidMount, один из lifecycle методов.

Как вариант, посмотрите в сторону Nextjs. Это server-side rendered React. Вы можете не париться с webpack и прочим и сразу начать писать код. Можно быстро пробежаться по Learn NextJS , чтоб разобраться с фреймворком.