Исправление ошибки Unexpected Keys в SSR режиме

[Zarwlar]

Сегодня на одном из проектов столкнулись с проблемой: при запуске ssr сыпались ошибки вида:

Unexpected keys "one", "two" found in initialState argument passed to createStore. Expected to find one of the known reducer keys instead: "events", "flash". Unexpected keys will be ignored.

Где "one", "two", "events", "flash" — имена фич.

И мы пофиксили эту проблему так же, как на другом проекте. Поэтому я подумал перенести это решение в стартер кит. Однако, после переноса иницилазции стейта после создания редюсеров, страница через сср перестала запускаться, т.к. некоторые стейты фич оказались undefined. Тогда я решил подцепить редаксы этих фич прямо в configureApp, как мы это делаем на других проектах. Из всего этого мне непонятно одно — почему тогда фичи работали раньше?)

P.S. Кстати, в SSR режиме у страницы нет стилей

[in19farkt]

А в чем причина этих ворнингов ты понял?

[in19farkt]

Тогда я решил подцепить редаксы этих фич прямо в configureApp, как мы это делаем на других проектах

И тем самым асинхронные фичи сделал синхронными

[in19farkt]

некоторые стейты фич оказались undefined

А причину этого ты понял?

[Zarwlar]

некоторые стейты фич оказались undefined

А причину этого ты понял?

Нет, я про это и написал. Я даже понять не могу, где они конектятся

[in19farkt]

Посмотри как сейчас асинхронные фичи подключаются к стору. Это прольет свет на то откуда появляются ворнинги. Которые кстати никоим образом не влияют на работоспособность приложения, но мозолят глаза в консоли)

[Zarwlar]

А в чем причина этих ворнингов ты понял?

На сколько я понял, в configureStore мы сразу цепляем весь стейт, а редюсеры добавляются в configureApp постепенно, и для них сразу весь стейт "кажется чужеродным"

[Zarwlar]

Просто если это норм тема, то почему от этого избавляются?) Или я что-то не понимаю?

[in19farkt]

На сколько я понял, в configureStore мы сразу цепляем весь стейт, а редюсеры добавляются в configureApp постепенно, и для них сразу весь стейт "кажется чужеродным"

Ага, всё верно)

[in19farkt]

Просто если это норм тема, то почему от этого избавляются?) Или я что-то не понимаю?

Не, на самом деле это недоработка)) Ща гляну что там с андефайнедом

[in19farkt]

Немного подебажил. Обнаружил несколько занятных моментов. Тестил тот вариант, когда есть асинхронные фичи и добавлен диспатч ресет_стейта в configureApp. Поэтапно че происходит на скриншоте:

• 1, 2 консоль лог. Это работает функция configureApp, которая первым делом подключает синхронные фичи theme и notification, 2 раза вызывается replaceReducer, что приводит к обновлению и вызову глобального редьюсера (создается нами с помощью core/configureStore.ts -> createReducer), видно что за счет этого постепенно формируется стейт
• 3 консоль лог. Функция configureApp продолжает свое исполнение и доходит до диспатча RESET_STATE. На этом этапе мы видим что в сторе уже есть ветки theme и notification, и с сервера нам пришел стейт с аналогичным содержанием.
• 4 Вызывается редьюсер номер 1 (созданный во время подключения фичи notification) с экшеном RESET_STATE. На данном этапе вроде всё нормально и логично (ну почти всё, поясню в конце что по-моему немного не правильно)
• 5 Подключается асинхронная фича usersSearch, вызывается replaceReducer, вызывается новый дополненный редьюсер номер 2, который формирует новый стейт.
• 6 А вот тут неждан. Редьюсер номер 2 вызывается повторно с экшеном RESET_STATE, у него в пейлоаде лежит стейт пришедший с сервера, в котором не подключена фича usersSearch, что приводит к подмене стейта и выпиливанию ветки usersSearch, сформированной на предыдущем шаге
• 7, 8 Аналогично пытается подключиться фича profile.

Вот скриншот:

В итоге мы имеем полностью сформированный редьюсер, а вот стейт не полноценный, что приводит к ошибке, при попытке заселектить стейт из ветки асинхронной фичи.

Какого хера редьюсер повторно вызывается с экшеном RESET_STATE, я не пытался понять, если кому интересно подебажте, пошарьтесь в коде редакса) Но фактически диспатчим мы его один раз, во время работы финкции configureApp, а вот редьюсер с этим экшеном почему-то вызывается на каждый вызов replaceReducer.

Второй непонятный момент, это то что при вызове replaceReducer, в новый редьюсер первым аргументом (state) прилетает undefined, хотя стейт вроде бы уже был сформирован. Причем если сразу перед вызовом store.replaceReducer(...), мы залогируем store.getState(), то увидим стейт, который вернул прошлый вызов редьюсера.

[in19farkt]

Закрываю ПР, т.к. не актуально и SSR нужно либо капитально перерабатывать, либо выпиливать