From f0f84513f8efe533b6ee670a6f1a0c074387b2ec Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Wed, 13 Aug 2025 12:01:46 +0200
Subject: Make use of SASS modules

---
 test/bem/_related-element.scss | 878 ++++++++++++++++++++---------------------
 1 file changed, 439 insertions(+), 439 deletions(-)

(limited to 'test/bem/_related-element.scss')

diff --git a/test/bem/_related-element.scss b/test/bem/_related-element.scss
index 5a829e8..48b3457 100644
--- a/test/bem/_related-element.scss
+++ b/test/bem/_related-element.scss
@@ -20,443 +20,443 @@
 //
 
 @include it('related-element') {
-    @include assert('single element, single related element') { /// 1 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    @include bem.related-elem('+', 'subchild1') {
-                        font-size: 2em;
-                    }
-
-                    @include bem.related-elem('~', 'subchild2') {
-                        font-size: 2em;
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child + .something__subchild1 {
-                font-size: 2em;
-            }
-
-            .something__child ~ .something__subchild2 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('single element, single related element, manual selector in-between') { /// 2 ///
-        @include output(false) {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    &:hover {
-                        @include bem.related-elem('+', 'subchild1') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild2') {
-                            font-size: 2em;
-                        }
-                    }
-
-                    .test & {
-                        @include bem.related-elem('+', 'subchild3') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild4') {
-                            font-size: 2em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect(false) {
-            .something__child:hover + .something__subchild1 {
-                font-size: 2em;
-            }
-
-            .something__child:hover ~ .something__subchild2 {
-                font-size: 2em;
-            }
-
-            .test .something__child + .something__subchild3 {
-                font-size: 2em;
-            }
-
-            .test .something__child ~ .something__subchild4 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('single element, single related element, modifier in-between') { /// 3 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    @include bem.modifier('mod') {
-                        @include bem.related-elem('+', 'subchild1') {
-                            font-size: 2.5em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild2') {
-                            font-size: 2.5em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child--mod + .something__subchild1 {
-                font-size: 2.5em;
-            }
-
-            .something__child--mod ~ .something__subchild2 {
-                font-size: 2.5em;
-            }
-        }
-    }
-
-    @include assert('single element, multiple related elements') { /// 4 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                        font-size: 2.5em;
-                    }
-
-                    @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                        font-size: 2.5em;
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child + .something__subchild1,
-            .something__child + .something__subchild2 {
-                font-size: 2.5em;
-            }
-
-            .something__child ~ .something__subchild3,
-            .something__child ~ .something__subchild4 {
-                font-size: 2.5em;
-            }
-        }
-    }
-
-    @include assert('single element, multiple related elements, manual selector in-between') { /// 5 ///
-        @include output(false) {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    &:hover {
-                        @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                            font-size: 2.5em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                            font-size: 2.5em;
-                        }
-                    }
-
-                    .test & {
-                        @include bem.related-elem('+', 'subchild5', 'subchild6') {
-                            font-size: 2.5em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild7', 'subchild8') {
-                            font-size: 2.5em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect(false) {
-            .something__child:hover + .something__subchild1,
-            .something__child:hover + .something__subchild2 {
-                font-size: 2.5em;
-            }
-
-            .something__child:hover ~ .something__subchild3,
-            .something__child:hover ~ .something__subchild4 {
-                font-size: 2.5em;
-            }
-
-            .test .something__child + .something__subchild5,
-            .test .something__child + .something__subchild6 {
-                font-size: 2.5em;
-            }
-
-            .test .something__child ~ .something__subchild7,
-            .test .something__child ~ .something__subchild8 {
-                font-size: 2.5em;
-            }
-        }
-    }
-
-    @include assert('single element, multiple related elements, modifier in-between') { /// 6 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child') {
-                    @include bem.modifier('mod') {
-                        @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                            font-size: 2.5em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                            font-size: 2.5em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child--mod + .something__subchild1,
-            .something__child--mod + .something__subchild2 {
-                font-size: 2.5em;
-            }
-
-            .something__child--mod ~ .something__subchild3,
-            .something__child--mod ~ .something__subchild4 {
-                font-size: 2.5em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, single related element') { /// 7 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    @include bem.related-elem('+', 'subchild1') {
-                        font-size: 2em;
-                    }
-
-                    @include bem.related-elem('~', 'subchild2') {
-                        font-size: 2em;
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child1 + .something__subchild1,
-            .something__child2 + .something__subchild1 {
-                font-size: 2em;
-            }
-
-            .something__child1 ~ .something__subchild2,
-            .something__child2 ~ .something__subchild2 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, single related element, manual selector in-between') { /// 8 ///
-        @include output(false) {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    &:hover {
-                        @include bem.related-elem('+', 'subchild1') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild2') {
-                            font-size: 2em;
-                        }
-                    }
-
-                    .test & {
-                        @include bem.related-elem('+', 'subchild3') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild4') {
-                            font-size: 2em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect(false) {
-            .something__child1:hover + .something__subchild1,
-            .something__child2:hover + .something__subchild1 {
-                font-size: 2em;
-            }
-
-            .something__child1:hover ~ .something__subchild2,
-            .something__child2:hover ~ .something__subchild2 {
-                font-size: 2em;
-            }
-
-            .test .something__child1 + .something__subchild3,
-            .test .something__child2 + .something__subchild3 {
-                font-size: 2em;
-            }
-
-            .test .something__child1 ~ .something__subchild4,
-            .test .something__child2 ~ .something__subchild4 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, single related element, modifier in-between') { /// 9 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    @include bem.modifier('mod') {
-                        @include bem.related-elem('+', 'subchild1') {
-                            font-size: 2.5em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild2') {
-                            font-size: 2.5em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child1--mod + .something__subchild1,
-            .something__child2--mod + .something__subchild1 {
-                font-size: 2.5em;
-            }
-
-            .something__child1--mod ~ .something__subchild2,
-            .something__child2--mod ~ .something__subchild2 {
-                font-size: 2.5em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, multiple related elements') { /// 10 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                        font-size: 2em;
-                    }
-
-                    @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                        font-size: 2em;
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child1 + .something__subchild1,
-            .something__child2 + .something__subchild1,
-            .something__child1 + .something__subchild2,
-            .something__child2 + .something__subchild2 {
-                font-size: 2em;
-            }
-
-            .something__child1 ~ .something__subchild3,
-            .something__child2 ~ .something__subchild3,
-            .something__child1 ~ .something__subchild4,
-            .something__child2 ~ .something__subchild4 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, multiple related elements, manual selector in-between') { /// 11 ///
-        @include output(false) {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    &:hover {
-                        @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                            font-size: 2em;
-                        }
-                    }
-
-                    .test & {
-                        @include bem.related-elem('+', 'subchild5', 'subchild6') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild7', 'subchild8') {
-                            font-size: 2em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect(false) {
-            .something__child1:hover + .something__subchild1,
-            .something__child2:hover + .something__subchild1,
-            .something__child1:hover + .something__subchild2,
-            .something__child2:hover + .something__subchild2 {
-                font-size: 2em;
-            }
-
-            .something__child1:hover ~ .something__subchild3,
-            .something__child2:hover ~ .something__subchild3,
-            .something__child1:hover ~ .something__subchild4,
-            .something__child2:hover ~ .something__subchild4 {
-                font-size: 2em;
-            }
-
-            .test .something__child1 + .something__subchild5,
-            .test .something__child2 + .something__subchild5,
-            .test .something__child1 + .something__subchild6,
-            .test .something__child2 + .something__subchild6 {
-                font-size: 2em;
-            }
-
-            .test .something__child1 ~ .something__subchild7,
-            .test .something__child2 ~ .something__subchild7,
-            .test .something__child1 ~ .something__subchild8,
-            .test .something__child2 ~ .something__subchild8 {
-                font-size: 2em;
-            }
-        }
-    }
-
-    @include assert('multiple elements, multiple related elements, modifier in-between') { /// 12 ///
-        @include output {
-            @include bem.block('something') {
-                @include bem.elem('child1', 'child2') {
-                    @include bem.modifier('mod') {
-                        @include bem.related-elem('+', 'subchild1', 'subchild2') {
-                            font-size: 2em;
-                        }
-
-                        @include bem.related-elem('~', 'subchild3', 'subchild4') {
-                            font-size: 2em;
-                        }
-                    }
-                }
-            }
-        }
-
-        @include expect {
-            .something__child1--mod + .something__subchild1,
-            .something__child2--mod + .something__subchild1,
-            .something__child1--mod + .something__subchild2,
-            .something__child2--mod + .something__subchild2 {
-                font-size: 2em;
-            }
-
-            .something__child1--mod ~ .something__subchild3,
-            .something__child2--mod ~ .something__subchild3,
-            .something__child1--mod ~ .something__subchild4,
-            .something__child2--mod ~ .something__subchild4 {
-                font-size: 2em;
-            }
-        }
-    }
+	@include assert('single element, single related element') { /// 1 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					@include bem.related-elem('+', 'subchild1') {
+						font-size: 2em;
+					}
+
+					@include bem.related-elem('~', 'subchild2') {
+						font-size: 2em;
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child + .something__subchild1 {
+				font-size: 2em;
+			}
+
+			.something__child ~ .something__subchild2 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('single element, single related element, manual selector in-between') { /// 2 ///
+		@include output(false) {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					&:hover {
+						@include bem.related-elem('+', 'subchild1') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild2') {
+							font-size: 2em;
+						}
+					}
+
+					.test & {
+						@include bem.related-elem('+', 'subchild3') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild4') {
+							font-size: 2em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect(false) {
+			.something__child:hover + .something__subchild1 {
+				font-size: 2em;
+			}
+
+			.something__child:hover ~ .something__subchild2 {
+				font-size: 2em;
+			}
+
+			.test .something__child + .something__subchild3 {
+				font-size: 2em;
+			}
+
+			.test .something__child ~ .something__subchild4 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('single element, single related element, modifier in-between') { /// 3 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					@include bem.modifier('mod') {
+						@include bem.related-elem('+', 'subchild1') {
+							font-size: 2.5em;
+						}
+
+						@include bem.related-elem('~', 'subchild2') {
+							font-size: 2.5em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child--mod + .something__subchild1 {
+				font-size: 2.5em;
+			}
+
+			.something__child--mod ~ .something__subchild2 {
+				font-size: 2.5em;
+			}
+		}
+	}
+
+	@include assert('single element, multiple related elements') { /// 4 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					@include bem.related-elem('+', 'subchild1', 'subchild2') {
+						font-size: 2.5em;
+					}
+
+					@include bem.related-elem('~', 'subchild3', 'subchild4') {
+						font-size: 2.5em;
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child + .something__subchild1,
+			.something__child + .something__subchild2 {
+				font-size: 2.5em;
+			}
+
+			.something__child ~ .something__subchild3,
+			.something__child ~ .something__subchild4 {
+				font-size: 2.5em;
+			}
+		}
+	}
+
+	@include assert('single element, multiple related elements, manual selector in-between') { /// 5 ///
+		@include output(false) {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					&:hover {
+						@include bem.related-elem('+', 'subchild1', 'subchild2') {
+							font-size: 2.5em;
+						}
+
+						@include bem.related-elem('~', 'subchild3', 'subchild4') {
+							font-size: 2.5em;
+						}
+					}
+
+					.test & {
+						@include bem.related-elem('+', 'subchild5', 'subchild6') {
+							font-size: 2.5em;
+						}
+
+						@include bem.related-elem('~', 'subchild7', 'subchild8') {
+							font-size: 2.5em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect(false) {
+			.something__child:hover + .something__subchild1,
+			.something__child:hover + .something__subchild2 {
+				font-size: 2.5em;
+			}
+
+			.something__child:hover ~ .something__subchild3,
+			.something__child:hover ~ .something__subchild4 {
+				font-size: 2.5em;
+			}
+
+			.test .something__child + .something__subchild5,
+			.test .something__child + .something__subchild6 {
+				font-size: 2.5em;
+			}
+
+			.test .something__child ~ .something__subchild7,
+			.test .something__child ~ .something__subchild8 {
+				font-size: 2.5em;
+			}
+		}
+	}
+
+	@include assert('single element, multiple related elements, modifier in-between') { /// 6 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child') {
+					@include bem.modifier('mod') {
+						@include bem.related-elem('+', 'subchild1', 'subchild2') {
+							font-size: 2.5em;
+						}
+
+						@include bem.related-elem('~', 'subchild3', 'subchild4') {
+							font-size: 2.5em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child--mod + .something__subchild1,
+			.something__child--mod + .something__subchild2 {
+				font-size: 2.5em;
+			}
+
+			.something__child--mod ~ .something__subchild3,
+			.something__child--mod ~ .something__subchild4 {
+				font-size: 2.5em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, single related element') { /// 7 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					@include bem.related-elem('+', 'subchild1') {
+						font-size: 2em;
+					}
+
+					@include bem.related-elem('~', 'subchild2') {
+						font-size: 2em;
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child1 + .something__subchild1,
+			.something__child2 + .something__subchild1 {
+				font-size: 2em;
+			}
+
+			.something__child1 ~ .something__subchild2,
+			.something__child2 ~ .something__subchild2 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, single related element, manual selector in-between') { /// 8 ///
+		@include output(false) {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					&:hover {
+						@include bem.related-elem('+', 'subchild1') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild2') {
+							font-size: 2em;
+						}
+					}
+
+					.test & {
+						@include bem.related-elem('+', 'subchild3') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild4') {
+							font-size: 2em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect(false) {
+			.something__child1:hover + .something__subchild1,
+			.something__child2:hover + .something__subchild1 {
+				font-size: 2em;
+			}
+
+			.something__child1:hover ~ .something__subchild2,
+			.something__child2:hover ~ .something__subchild2 {
+				font-size: 2em;
+			}
+
+			.test .something__child1 + .something__subchild3,
+			.test .something__child2 + .something__subchild3 {
+				font-size: 2em;
+			}
+
+			.test .something__child1 ~ .something__subchild4,
+			.test .something__child2 ~ .something__subchild4 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, single related element, modifier in-between') { /// 9 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					@include bem.modifier('mod') {
+						@include bem.related-elem('+', 'subchild1') {
+							font-size: 2.5em;
+						}
+
+						@include bem.related-elem('~', 'subchild2') {
+							font-size: 2.5em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child1--mod + .something__subchild1,
+			.something__child2--mod + .something__subchild1 {
+				font-size: 2.5em;
+			}
+
+			.something__child1--mod ~ .something__subchild2,
+			.something__child2--mod ~ .something__subchild2 {
+				font-size: 2.5em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, multiple related elements') { /// 10 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					@include bem.related-elem('+', 'subchild1', 'subchild2') {
+						font-size: 2em;
+					}
+
+					@include bem.related-elem('~', 'subchild3', 'subchild4') {
+						font-size: 2em;
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child1 + .something__subchild1,
+			.something__child2 + .something__subchild1,
+			.something__child1 + .something__subchild2,
+			.something__child2 + .something__subchild2 {
+				font-size: 2em;
+			}
+
+			.something__child1 ~ .something__subchild3,
+			.something__child2 ~ .something__subchild3,
+			.something__child1 ~ .something__subchild4,
+			.something__child2 ~ .something__subchild4 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, multiple related elements, manual selector in-between') { /// 11 ///
+		@include output(false) {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					&:hover {
+						@include bem.related-elem('+', 'subchild1', 'subchild2') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild3', 'subchild4') {
+							font-size: 2em;
+						}
+					}
+
+					.test & {
+						@include bem.related-elem('+', 'subchild5', 'subchild6') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild7', 'subchild8') {
+							font-size: 2em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect(false) {
+			.something__child1:hover + .something__subchild1,
+			.something__child2:hover + .something__subchild1,
+			.something__child1:hover + .something__subchild2,
+			.something__child2:hover + .something__subchild2 {
+				font-size: 2em;
+			}
+
+			.something__child1:hover ~ .something__subchild3,
+			.something__child2:hover ~ .something__subchild3,
+			.something__child1:hover ~ .something__subchild4,
+			.something__child2:hover ~ .something__subchild4 {
+				font-size: 2em;
+			}
+
+			.test .something__child1 + .something__subchild5,
+			.test .something__child2 + .something__subchild5,
+			.test .something__child1 + .something__subchild6,
+			.test .something__child2 + .something__subchild6 {
+				font-size: 2em;
+			}
+
+			.test .something__child1 ~ .something__subchild7,
+			.test .something__child2 ~ .something__subchild7,
+			.test .something__child1 ~ .something__subchild8,
+			.test .something__child2 ~ .something__subchild8 {
+				font-size: 2em;
+			}
+		}
+	}
+
+	@include assert('multiple elements, multiple related elements, modifier in-between') { /// 12 ///
+		@include output {
+			@include bem.block('something') {
+				@include bem.elem('child1', 'child2') {
+					@include bem.modifier('mod') {
+						@include bem.related-elem('+', 'subchild1', 'subchild2') {
+							font-size: 2em;
+						}
+
+						@include bem.related-elem('~', 'subchild3', 'subchild4') {
+							font-size: 2em;
+						}
+					}
+				}
+			}
+		}
+
+		@include expect {
+			.something__child1--mod + .something__subchild1,
+			.something__child2--mod + .something__subchild1,
+			.something__child1--mod + .something__subchild2,
+			.something__child2--mod + .something__subchild2 {
+				font-size: 2em;
+			}
+
+			.something__child1--mod ~ .something__subchild3,
+			.something__child2--mod ~ .something__subchild3,
+			.something__child1--mod ~ .something__subchild4,
+			.something__child2--mod ~ .something__subchild4 {
+				font-size: 2em;
+			}
+		}
+	}
 }
-- 
cgit v1.2.3-70-g09d2