там в примере не то чтобы верстку тестируют, а работу компонента.

Работа компонента - отображать содержимое.

Берешь джест с энзимом, клепаешь скринов и в матчер, если % несовпадений выше заданного — бьешь тревогу

Берешь джест с энзимом, клепаешь скринов и в матчер, если % несовпадений выше заданного — бьешь тревогу

Чуваки дом тестируют.

Работа компонента - отображать содержимое.

ок, то есть тестировать, что по ченжу в такой-то инпут происходит изменение стейта - вы смысла не видите, и следовательно - не надо так делать. Верно я понял?

ок, то есть тестировать, что по ченжу в такой-то инпут происходит изменение стейта - вы смысла не видите, и следовательно - не надо так делать. Верно я понял?

У меня нет стейта в компонентах.

У меня нет стейта в компонентах.

хорошо, тогда вы не можете посоветовать как тестировать изменение стейта =(

Стейт находится снаружи и является частью логики, которая живёт в отрыве от реакта.

И, следовательно, прекрасно тестируется.

Стейт находится снаружи и является частью логики, которая живёт в отрыве от реакта.

хз, для меня пока это непонятно, есть форма с инпутами, есть стейт

А тут уже жара сутра пораньше)

Стейт находится снаружи и является частью логики, которая живёт в отрыве от реакта.

Весь стейт вне компонентов? Зачем все это?

Весь стейт вне компонентов? Зачем все это?

Уменьшение сложности. Поясню ниже.

Вроде же уже давно реакт проапдейтили и стали топить за стейт и fetch внутри компонентов если это нужно

Уменьшение сложности. Поясню ниже.

Если у меня есть маленький дропдаун который работает со своим методом на беке и показывается только на 1 странице и его данные больше никому не нужны, это тоже стейт снаружи?

Уменьшение сложности. Поясню ниже.

можно просто пример с формой, есть может где-то в закормах, чтобы визуально тоже оценить

Если у меня есть маленький дропдаун который работает со своим методом на беке и показывается только на 1 странице и его данные больше никому не нужны, это тоже стейт снаружи?

Две правды тоже плохо с другой стороны

Вроде же уже давно реакт проапдейтили и стали топить за стейт и fetch внутри компонентов если это нужно

Зачастую есть сценарий, когда у тебя общий стейт у множества компонентов. И тут приходится использовать внешний стейт, например редакс. Поэтому для упрощения восприятия лучше вообще не использовать внутренний стейт.

Крассический MVVM. Реакт отвечает только за рендеринг. В нём никакой логики нет.

Солидарен ?

Ребята, формы свои покажите, плиз

Я не такая

Я не такая

я жду самурая

Годы прошли, а проблемы все теже)

Ребята, формы свои покажите, плиз

мы не так близко знакомы

Ребята, формы свои покажите, плиз

https://reactjs.org/docs/forms.html#controlled-components

Как на счёт GraphQL? Там эта проблема решается?

Только стейт находится снаружи.

https://reactjs.org/docs/forms.html#controlled-components

и как тестировать изменение стейта по вводу в input?

Только стейт находится снаружи.

зачем/почему? для меня это усложнение лишнее

зачем/почему? для меня это усложнение лишнее

Потому что если форма имеет глубину больше 1, то ты задолбаешься прокидывать пропсы.

и как тестировать изменение стейта по вводу в input?

А зачем?

А зачем?

так с этого же и началось, я хочу например, быть уверен, что если кто-нибудь снимет onChange (ну я хз, что придумать, опечатку там внесет в название функции или что-то еще) - то сразу тест упадет

так с этого же и началось, я хочу например, быть уверен, что если кто-нибудь снимет onChange (ну я хз, что придумать, опечатку там внесет в название функции или что-то еще) - то сразу тест упадет

Опечатки контролируются типизацией.

Опечатки контролируются типизацией.

например: onChange ={this.handleeChange} а у нас у компонента только handleChange, как это типизируется?

Тестировать компоненты кроме как в e2e бесмысленно.

например: onChange ={this.handleeChange} а у нас у компонента только handleChange, как это типизируется?

Спокойно. В компоненте нет такого метода. Тебе и тс, и flow об этом скажет.

Спокойно. В компоненте нет такого метода. Тебе и тс, и flow об этом скажет.

метод же не из props пришел, чет я торможу, ща проверю

Спокойно. В компоненте нет такого метода. Тебе и тс, и flow об этом скажет.

да, все верно в этом вопросе, ок

Опечатки контролируются типизацией.

я пока такой кейс придумал: например в data-* атрибуте хранится что-то нужное, что потом в функции-обработчике считывается. И если дата атрибут изменить, то получится что значение будет считано не корректное, и в итоге тест это может показать

я пока такой кейс придумал: например в data-* атрибуте хранится что-то нужное, что потом в функции-обработчике считывается. И если дата атрибут изменить, то получится что значение будет считано не корректное, и в итоге тест это может показать

data атрибуты не нужны.

я пока такой кейс придумал: например в data-* атрибуте хранится что-то нужное, что потом в функции-обработчике считывается. И если дата атрибут изменить, то получится что значение будет считано не корректное, и в итоге тест это может показать

или если сломана какая-то логика устанавливающая дата атрибуты

data атрибуты не нужны.

тогда пока останемся при своих мнениях, видимо; слишком сильно различаются толи уровни, то ли подходы

Где-то слышал что новый вордпрес на реакте - это правда?

Сейчас уже и ExtJS на реакте

Ну это о разном

Вордпрес же можно как цмс использовать?

Можно

Где-то слышал что новый вордпрес на реакте - это правда?

Может там имелось ввиду, что админ панель на реакте

Аа =(

я не знаю, что такое Calypso в вп, но вот Calypso uses a thin layer of Node.js on the server to build the initial web page, and much of the logic is run in the client as a Single Page Application (SPA) built in-house, leveraging many other open source JavaScript modules. Calypso adopted Facebook's React view library early on, and has been heavily influenced by other open source work in the React community.

ребята, куда лучше вынести общие для компонентов функции (закрытие по esc, фокусирование по input-ам, и тд) ?

я так понял композиция в данном случае не совсем подходит

Тесты для компонентов лучше хранить в отдельно папке проекта или создавать папку tests для каждого компонента и контейнеров?

Тесты для компонентов лучше хранить в отдельно папке проекта или создавать папку tests для каждого компонента и контейнеров?

Можно хранить тест и компонент в одной директории

Можно хранить тест и компонент в одной директории

+1

Спасибо!

Короче. Есть функция которая создается где-то при инициализации приложения. Как ее правильнее всего пробросить во все части приложения? React.Component.prototype.myfunc = … или создать отдельный компонент который будет принимать функцию отдающую контент и в этот контект пробрасывать мою функцию типа <MyComponent content={ (myfunc) => <View>....</View> } /> ?

проблема первого подхода это жуткий хак и так неправильно потому что неправильно проблема второго это надо везде писать такую конструкцию

Короче. Есть функция которая создается где-то при инициализации приложения. Как ее правильнее всего пробросить во все части приложения? React.Component.prototype.myfunc = … или создать отдельный компонент который будет принимать функцию отдающую контент и в этот контект пробрасывать мою функцию типа <MyComponent content={ (myfunc) => <View>....</View> } /> ?

через контекст или рендер пропс

то есть второй вариант?

то есть второй вариант?

как удобно тебе будет

удобнее то первый но это плохая практика, вроде?

удобнее то первый но это плохая практика, вроде?

с чего контекст стал плохой практикой?)

Короче. Есть функция которая создается где-то при инициализации приложения. Как ее правильнее всего пробросить во все части приложения? React.Component.prototype.myfunc = … или создать отдельный компонент который будет принимать функцию отдающую контент и в этот контект пробрасывать мою функцию типа <MyComponent content={ (myfunc) => <View>....</View> } /> ?

почему её нельзя просто импортировать везде, где надо? она к this компонента обращается чтоли?

Нет, она создается

Ну типа myfunc = myotherfunc.bind(null, some, params, that, i, dont, want, to, pass, anywhere)

ERROR: S client not available

Ну типа myfunc = myotherfunc.bind(null, some, params, that, i, dont, want, to, pass, anywhere)

кроме все остального, ты можешь создать singleton, с одним методом, который функцию твою создаёт, потом этот синглтон можно ипортировать везде и созданную функцию вызывать

А где она в таком случае будет хранится?

в замыкании

? надо попробовать

спасибо

Привет! Подскажите, если у меня есть рядом два тега компонента - первый считает значение, второй должен его использовать. Могу я выкинуть проп из первого наверх же?

Привет! Подскажите, если у меня есть рядом два тега компонента - первый считает значение, второй должен его использовать. Могу я выкинуть проп из первого наверх же?

колбеком

у меня есть scss с медия выражениями, его импорт в index.scss не делает его глобальным

у меня в реакте такая же ситуация, я импортирую файл с переменными в каждом файле стилей не нашла обходного пути

у меня в реакте такая же ситуация, я импортирую файл с переменными в каждом файле стилей не нашла обходного пути

его и не будет

Насколько плохо сразу подключать весь стейт в компоненты? Структуризация говно и не разрешают переделывать, поэтому часто такое, что в компоненту подключается хренова туча данных из стейта и выглядит это так себе

Насколько плохо сразу подключать весь стейт в компоненты? Структуризация говно и не разрешают переделывать, поэтому часто такое, что в компоненту подключается хренова туча данных из стейта и выглядит это так себе

весь стейт?

весь стейт?

Ридакс, весь общий стейт

Ридакс, весь общий стейт

mapStateToProps не юзается чтоль?

store => store типа такого?)

Было такое от прошлого чувака, но как-то неловко себя чувствую когда в пропсах весь стор, поэтому ток нужное вытягиваю в mapStateToProps

mapStateToProps не юзается чтоль?

Да в том-то и дело, я хочу вынести, пушо там много, но мне не разрешают, мол и так хорошо, а выглядит это state => ({ ...state, bla: bla, bla: bla, .... too much })

Было такое от прошлого чувака, но как-то неловко себя чувствую когда в пропсах весь стор, поэтому ток нужное вытягиваю в mapStateToProps

Да я тоже так хочу, но не когда это все прям в коннект лепится, файлы и так большие, ну куда блин

Ох уж этот японский консерватизм

const mapStateToProps = store => store было вообще так лол

const mapStateToProps = store => store было вообще так лол

?

Я сильно психую, сделал тултип, отличный тултип, всем тултипам тултип Сказали, что тултип как тултип нам не нужен, давай просто запилим его с хардкод текстом ?

Я сильно психую, сделал тултип, отличный тултип, всем тултипам тултип Сказали, что тултип как тултип нам не нужен, давай просто запилим его с хардкод текстом ?

?странная фигня

Ну я все понимаю, ну а нахера мы тогда вообще пользуемся реактом (преактом), если нам не нужны динамические компоненты?

Ридакс, весь общий стейт

Не мутить всего один общий стейт

Не мутить всего один общий стейт

Но-но, стейт один, разные редюсеры с инишл стейтом

Это не противоречит)

Ну я все понимаю, ну а нахера мы тогда вообще пользуемся реактом (преактом), если нам не нужны динамические компоненты?

скорей переиспользуемые

Мне срочно нужно начать делать свое приложение, ибо я тут чекнусь и привыкну к такому, а как жить потом...

Я сильно психую, сделал тултип, отличный тултип, всем тултипам тултип Сказали, что тултип как тултип нам не нужен, давай просто запилим его с хардкод текстом ?

?захардкодь в props

привет, а кто может подсказать хороший календарь, который можно было бы открывать по кастомному элементу? например по иконке, а то большенство элементов открвыается с помощью инпута

?захардкодь в props

Та ну я все, я уже ничего не хочу крутого тут пилить, просто буду делать как быстрее и хватит

Та ну я все, я уже ничего не хочу крутого тут пилить, просто буду делать как быстрее и хватит

Смени работу