1 files changed, 591 insertions, 0 deletions

diff --git a/test/bem/_iro-bem-multi.scss b/test/bem/_iro-bem-multi.scss
new file mode 100644
index 0000000..84bbca2
--- /dev/null
+++ b/test/bem/_iro-bem-multi.scss
@@ -0,0 +1,591 @@
+// sass-lint:disable class-name-format force-element-nesting force-pseudo-nesting mixins-before-declarations
+
+//
+// Included test cases:
+//  - /// 1 ///  - in root, 2 blocks
+//  - /// 2 ///  - in root, 1 block, 1 manual selector
+//  - /// 3 ///  - in block, 2 elements
+//  - /// 4 ///  - in block, 1 element, 1 modifier
+//  - /// 5 ///  - in block, 1 element, 1 extending modifier
+//  - /// 6 ///  - in block, 1 element, 1 & selector
+//  - /// 7 ///  - in block, 1 element, 1 manual selector
+//  - /// 8 ///  - in element, 2 elements, 1 modifier
+//  - /// 9 ///  - in element, 1 element, 1 & selector
+//  - /// 10 /// - in element in manual selector, 2 elements
+//  - /// 11 /// - in element in manual selector, 1 element, 1 & selector
+//  - /// 12 /// - in multiple elements, 2 elements, 1 modifier
+//  - /// 13 /// - in multiple elements, 1 element, 1 & selector
+//  - /// 14 /// - in related elements, 2 elements, 1 modifier
+//  - /// 15 /// - in related elements, 1 element, 1 & selector
+//  - /// 16 /// - in element, 2 related elements, 1 modifier
+//  - /// 17 /// - in element, 1 twin element, 1 modifier
+//  - /// 18 /// - in multiple elements, 1 twin element, 1 modifier
+//
+
+@include it('iro-bem-state') {
+    @include assert('in root, 2 blocks') { /// 1 ///
+        @include output {
+            @include iro-bem-multi('component:' 'block1', 'object:' 'block2') {
+                font-size: 1em;
+
+                @include iro-bem-element('child2') {
+                    font-size: 2em;
+                }
+            }
+        }
+
+        @include expect {
+            .c-block1 {
+                font-size: 1em;
+            }
+
+            .c-block1__child2 {
+                font-size: 2em;
+            }
+
+            .o-block2 {
+                font-size: 1em;
+            }
+
+            .o-block2__child2 {
+                font-size: 2em;
+            }
+        }
+    }
+
+    @include assert('in root, 1 block, 1 manual selector') { /// 2 ///
+        @include output {
+            @include iro-bem-multi('component:' 'block1', 'a:hover') {
+                font-size: 1em;
+            }
+        }
+
+        @include expect {
+            .c-block1 {
+                font-size: 1em;
+            }
+
+            a:hover {
+                font-size: 1em;
+            }
+        }
+    }
+
+    @include assert('in block, 2 elements') { /// 3 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-multi('element:' 'child1' 'child2') {
+                    font-size: 2em;
+
+                    @include iro-bem-modifier('mod') {
+                        font-size: 2.5em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1,
+            .something__child2 {
+                font-size: 2em;
+            }
+
+            .something__child1--mod,
+            .something__child2--mod {
+                font-size: 2.5em;
+            }
+        }
+    }
+
+    @include assert('in block, 1 element, 1 modifier') { /// 4 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-multi('element:' 'child', 'modifier:' 'mod1') {
+                    font-size: 2em;
+
+                    @include iro-bem-modifier('mod2') {
+                        font-size: 2.5em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child {
+                font-size: 2em;
+            }
+
+            .something__child--mod2 {
+                font-size: 2.5em;
+            }
+
+            .something--mod1 {
+                font-size: 2em;
+            }
+
+            .something--mod1.something--mod2 {
+                font-size: 2.5em;
+            }
+        }
+    }
+
+    @include assert('in block, 1 element, 1 extending modifier') { /// 5 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-multi('element:' 'child', 'modifier:' 'mod1') {
+                    font-size: 2em;
+
+                    @include iro-bem-modifier('mod2' true) {
+                        font-size: 2.5em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child {
+                font-size: 2em;
+            }
+
+            .something__child--mod2 {
+                font-size: 2.5em;
+            }
+
+            .something--mod1 {
+                font-size: 2em;
+            }
+
+            .something--mod1--mod2 {
+                font-size: 2.5em;
+            }
+        }
+    }
+
+    @include assert('in block, 1 element, 1 & selector') { /// 6 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-multi('&', 'element:' 'child') {
+                    font-size: 2em;
+
+                    @include iro-bem-modifier('mod') {
+                        font-size: 2.5em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something {
+                font-size: 2em;
+            }
+
+            .something--mod {
+                font-size: 2.5em;
+            }
+
+            .something__child {
+                font-size: 2em;
+            }
+
+            .something__child--mod {
+                font-size: 2.5em;
+            }
+        }
+    }
+
+    @include assert('in block, 1 element, 1 manual selector') { /// 7 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-multi('> a:hover', 'element:' 'child1') {
+                    font-size: 2em;
+
+                    @include iro-bem-element('child2') {
+                        font-size: 3em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something > a:hover {
+                font-size: 2em;
+            }
+
+            .something > a:hover .something__child2 {
+                font-size: 3em;
+            }
+
+            .something__child1 {
+                font-size: 2em;
+            }
+
+            .something__child1 .something__child2 {
+                font-size: 3em;
+            }
+        }
+    }
+
+    @include assert('in element, 2 elements, 1 modifier') { /// 8 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child') {
+                    @include iro-bem-multi('element:' 'subchild1' 'subchild2', 'modifier:' 'mod1') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod2') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child .something__subchild1,
+            .something__child .something__subchild2 {
+                font-size: 3em;
+            }
+
+            .something__child .something__subchild1--mod2,
+            .something__child .something__subchild2--mod2 {
+                font-size: 3.5em;
+            }
+
+            .something__child--mod1 {
+                font-size: 3em;
+            }
+
+            .something__child--mod1.something__child--mod2 {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in element, 1 element, 1 & selector') { /// 9 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child') {
+                    @include iro-bem-multi('element:' 'subchild', '&') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child .something__subchild {
+                font-size: 3em;
+            }
+
+            .something__child .something__subchild--mod {
+                font-size: 3.5em;
+            }
+
+            .something__child {
+                font-size: 3em;
+            }
+
+            .something__child--mod {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in element in manual selector, 2 elements') { /// 10 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child') {
+                    &:hover {
+                        @include iro-bem-multi('element:' 'subchild1' 'subchild2') {
+                            font-size: 3em;
+
+                            @include iro-bem-modifier('mod2') {
+                                font-size: 3.5em;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child:hover .something__subchild1,
+            .something__child:hover .something__subchild2 {
+                font-size: 3em;
+            }
+
+            .something__child:hover .something__subchild1--mod2,
+            .something__child:hover .something__subchild2--mod2 {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in element in manual selector, 1 element, 1 & selector') { /// 11 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child') {
+                    &:hover {
+                        @include iro-bem-multi('element:' 'subchild', '&') {
+                            font-size: 3em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child:hover .something__subchild {
+                font-size: 3em;
+            }
+
+            .something__child:hover {
+                font-size: 3em;
+            }
+        }
+    }
+
+    @include assert('in multiple elements, 2 elements, 1 modifier') { /// 12 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1', 'child2') {
+                    @include iro-bem-multi('element:' 'subchild1' 'subchild2', 'modifier:' 'mod') {
+                        font-size: 3em;
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 .something__subchild1,
+            .something__child2 .something__subchild1,
+            .something__child1 .something__subchild2,
+            .something__child2 .something__subchild2  {
+                font-size: 3em;
+            }
+
+            .something__child1--mod,
+            .something__child2--mod {
+                font-size: 3em;
+            }
+        }
+    }
+
+    @include assert('in multiple elements, 1 element, 1 & selector') { /// 13 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1', 'child2') {
+                    @include iro-bem-multi('element:' 'subchild', '&') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 .something__subchild,
+            .something__child2 .something__subchild {
+                font-size: 3em;
+            }
+
+            .something__child1 .something__subchild--mod,
+            .something__child2 .something__subchild--mod {
+                font-size: 3.5em;
+            }
+
+            .something__child1,
+            .something__child2 {
+                font-size: 3em;
+            }
+
+            .something__child1--mod,
+            .something__child2--mod {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in related elements, 2 elements, 1 modifier') { /// 14 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1') {
+                    @include iro-bem-next-element('child2', 'child3') {
+                        @include iro-bem-multi('element:' 'subchild1' 'subchild2', 'modifier:' 'mod') {
+                            font-size: 3em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 + .something__child2 .something__subchild1,
+            .something__child1 + .something__child3 .something__subchild1,
+            .something__child1 + .something__child2 .something__subchild2,
+            .something__child1 + .something__child3 .something__subchild2 {
+                font-size: 3em;
+            }
+
+            .something__child1 + .something__child2--mod,
+            .something__child1 + .something__child3--mod {
+                font-size: 3em;
+            }
+        }
+    }
+
+    @include assert('in related elements, 1 element, 1 & selector') { /// 15 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1') {
+                    @include iro-bem-next-element('child2', 'child3') {
+                        @include iro-bem-multi('element:' 'subchild', '&') {
+                            font-size: 4em;
+
+                            @include iro-bem-modifier('mod') {
+                                font-size: 4.5em;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 + .something__child2 .something__subchild,
+            .something__child1 + .something__child3 .something__subchild {
+                font-size: 4em;
+            }
+
+            .something__child1 + .something__child2 .something__subchild--mod,
+            .something__child1 + .something__child3 .something__subchild--mod {
+                font-size: 4.5em;
+            }
+
+            .something__child1 + .something__child2,
+            .something__child1 + .something__child3 {
+                font-size: 4em;
+            }
+
+            .something__child1 + .something__child2--mod,
+            .something__child1 + .something__child3--mod {
+                font-size: 4.5em;
+            }
+        }
+    }
+
+    @include assert('in element, 2 related elements, 1 modifier') { /// 16 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1') {
+                    @include iro-bem-multi('next-element:' 'child2' 'child3', 'modifier:' 'mod1') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod2') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 + .something__child2,
+            .something__child1 + .something__child3 {
+                font-size: 3em;
+            }
+
+            .something__child1 + .something__child2--mod2,
+            .something__child1 + .something__child3--mod2 {
+                font-size: 3.5em;
+            }
+
+            .something__child1--mod1 {
+                font-size: 3em;
+            }
+
+            .something__child1--mod1.something__child1--mod2 {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in element, 1 twin element, 1 modifier') { /// 17 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child') {
+                    @include iro-bem-multi('next-twin-element', 'modifier:' 'mod1') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod2') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child + .something__child {
+                font-size: 3em;
+            }
+
+            .something__child + .something__child--mod2 {
+                font-size: 3.5em;
+            }
+
+            .something__child--mod1 {
+                font-size: 3em;
+            }
+
+            .something__child--mod1.something__child--mod2 {
+                font-size: 3.5em;
+            }
+        }
+    }
+
+    @include assert('in multiple elements, 1 twin element, 1 modifier') { /// 18 ///
+        @include output {
+            @include iro-bem-block('something') {
+                @include iro-bem-element('child1', 'child2') {
+                    @include iro-bem-multi('next-twin-element', 'modifier:' 'mod1') {
+                        font-size: 3em;
+
+                        @include iro-bem-modifier('mod2') {
+                            font-size: 3.5em;
+                        }
+                    }
+                }
+            }
+        }
+
+        @include expect {
+            .something__child1 + .something__child1,
+            .something__child2 + .something__child2 {
+                font-size: 3em;
+            }
+
+            .something__child1 + .something__child1--mod2,
+            .something__child2 + .something__child2--mod2 {
+                font-size: 3.5em;
+            }
+
+            .something__child1--mod1,
+            .something__child2--mod1 {
+                font-size: 3em;
+            }
+
+            .something__child1--mod1.something__child1--mod2,
+            .something__child2--mod1.something__child2--mod2 {
+                font-size: 3.5em;
+            }
+        }
+    }
+}