Голосовалка за новое Api в bem-core https://github.com/bem/bem-core/issues/1601

Есть два блока: a и b. Я хочу для блока b задать особые стили, но только для случая, когда он внутри блока a. Я делаю микс <div class="a"><div class="b a__b"></div></div>, и в CSS использую селектор .a__b, верно? А что, если я хочу задать особые стили не всякому b внутри a, а только b с модификатором b_mod_m внутри a? Микс будет выглядеть так: <div class="a"><div class="b b_mod_m a__b"></div></div>? А какой селектор я использую? .a__b.b_mod_m?

Но так специфичность выше, чем нужно.

Лучше делать микс <div class="a"><div class="b a__b_mod_m"></div></div> и селектор .a__b_mod_m?

Последнее звучит не очень, к тому же ты вешаешь модификатор без блока\элемента

почему не использовать просто .b.a__b { … }?

Потому что "методология БЭМ не рекомендует": https://ru.bem.info/methodology/css/#%D0%9A%D0%BE%D0%BC%D0%B1%D0%B8%D0%BD%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%BD%D1%8B%D0%B5-%D1%81%D0%B5%D0%BB%D0%B5%D0%BA%D1%82%D0%BE%D1%80%D1%8B

звучит как булшит)

используй, все норм

если хочется «остаться чистеньким», то тогда уж не нужно делать контекстной зависимости вовсе и просто выражать всё через нужные модификаторы блока b

Но мне нужно задать стили именно для b с неким модификатором внутри a. Я попробую привести более конкретный пример. Допустим есть блок form, и в нём несколько блоков input. После валидации некоторые input имеют модификатор input_invalid.
HTML:

<form action="" method="post" class="form">
<input type="text" name="foo" class="input">
<input type="text" name="bar" class="input input_invalid">
</form>

CSS:

.input_invalid {
color: red;
}

А я хочу, чтобы невалидные инпуты внутри .form имели color: blue. Какой из способов достигнуть этого более БЭМовый? Добавить для всех input микс form__input и CSS-правило form__input.input_invalid { color: blue; } ? Или вместо модификатора input_invalid добавить модификатор form__input_invalid и CSS-правило form__input_invalid { color: blue; }? Второй вариант не использует комбинированные селекторы, так что не добавляет проблем со специфичностью, но он смотрится как-то странно.

<form action="" method="post" class="form">
<input type="text" name="foo" class="form__input input">
<input type="text" name="bar" class="form__input input form__input_status_invalid">
</form>

если это модификатор только для поля формы

если это глобальный модификатор состояния для поля, то input_status_invalid

<form action="" method="post" class="form">
<input type="text" name="foo" class="input">
<input type="text" name="bar" class="input input_invalid">
</form>

.input_invalid {
color: red;
}

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

Ага, то есть, чтобы применить к input модификатор form__input_invalid нужно также сделать микс form__input. Звучит логично, спасибо за ответы.

Потому что это вымышленный пример :)

если приведёшь реальный, можно будет дать максимально предметный совет, т. к. действительно универсального ответа нет

Приветствую в ibemjs какое решение для валидации форм есть?

в самом i-bem нет ничего для валидаций. Но есть библиотека bem-forms https://github.com/bem-contrib/bem-forms/tree/v2.0.0/common.blocks/validation

а есть пример как этим воспользоваться?