mirror of
https://github.com/cloud-shuttle/leptos-shadcn-ui.git
synced 2025-12-22 22:00:00 +00:00
- All 9 components fully refactored with modular architecture - 45+ test modules created and organized - File size compliance achieved (99% reduction) - Enterprise-grade code quality implemented - All compilation issues resolved Ready for v0.9.0 release publication!
255 lines
9.8 KiB
Rust
255 lines
9.8 KiB
Rust
#[cfg(test)]
|
|
mod basic_rendering {
|
|
use crate::default::{Button, ButtonVariant, ButtonSize, ButtonChildProps, BUTTON_CLASS};
|
|
use leptos::prelude::*;
|
|
use leptos::html::*;
|
|
use leptos::leptos_dom::*;
|
|
use std::sync::{Arc, Mutex};
|
|
use web_sys::wasm_bindgen::JsCast;
|
|
use wasm_bindgen_test::*;
|
|
|
|
wasm_bindgen_test_configure!(run_in_browser);
|
|
|
|
// Helper function to render button for testing
|
|
fn render_button_with_props(variant: ButtonVariant, size: ButtonSize, disabled: bool, children: &str) -> HtmlElement<Button> {
|
|
view! {
|
|
<Button variant=variant size=size disabled=Signal::from(disabled)>
|
|
{children}
|
|
</Button>
|
|
}.unchecked_into()
|
|
}
|
|
|
|
// Helper function to create button with click handler
|
|
fn render_button_with_click_handler(children: &str) -> (HtmlElement<Button>, Arc<Mutex<bool>>) {
|
|
let clicked = Arc::new(Mutex::new(false));
|
|
let clicked_clone = Arc::clone(&clicked);
|
|
|
|
let button = view! {
|
|
<Button on_click=Callback::new(move |_| {
|
|
*clicked_clone.lock().unwrap() = true;
|
|
})>
|
|
{children}
|
|
</Button>
|
|
}.unchecked_into();
|
|
|
|
(button, clicked)
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_correct_element_type() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Click me");
|
|
|
|
// Test that it renders as a button element
|
|
assert_eq!(button.node_name(), "BUTTON");
|
|
assert_eq!(button.get_attribute("type"), Some("button".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_displays_children_content() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Test Button");
|
|
|
|
// Test that children content is displayed
|
|
assert_eq!(button.text_content(), Some("Test Button".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_default_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Default Button");
|
|
|
|
// Test that default variant is applied
|
|
assert!(button.class_name().contains("bg-primary"));
|
|
assert!(button.class_name().contains("text-primary-foreground"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_destructive_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Destructive, ButtonSize::Default, false, "Destructive Button");
|
|
|
|
// Test that destructive variant is applied
|
|
assert!(button.class_name().contains("bg-destructive"));
|
|
assert!(button.class_name().contains("text-destructive-foreground"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_outline_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Outline, ButtonSize::Default, false, "Outline Button");
|
|
|
|
// Test that outline variant is applied
|
|
assert!(button.class_name().contains("border"));
|
|
assert!(button.class_name().contains("border-input"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_secondary_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Secondary, ButtonSize::Default, false, "Secondary Button");
|
|
|
|
// Test that secondary variant is applied
|
|
assert!(button.class_name().contains("bg-secondary"));
|
|
assert!(button.class_name().contains("text-secondary-foreground"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_ghost_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Ghost, ButtonSize::Default, false, "Ghost Button");
|
|
|
|
// Test that ghost variant is applied
|
|
assert!(button.class_name().contains("hover:bg-accent"));
|
|
assert!(button.class_name().contains("hover:text-accent-foreground"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_link_variant() {
|
|
let button = render_button_with_props(ButtonVariant::Link, ButtonSize::Default, false, "Link Button");
|
|
|
|
// Test that link variant is applied
|
|
assert!(button.class_name().contains("text-primary"));
|
|
assert!(button.class_name().contains("underline-offset-4"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_default_size() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Default Size");
|
|
|
|
// Test that default size is applied
|
|
assert!(button.class_name().contains("h-10"));
|
|
assert!(button.class_name().contains("px-4"));
|
|
assert!(button.class_name().contains("py-2"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_small_size() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Sm, false, "Small Size");
|
|
|
|
// Test that small size is applied
|
|
assert!(button.class_name().contains("h-9"));
|
|
assert!(button.class_name().contains("px-3"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_large_size() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Lg, false, "Large Size");
|
|
|
|
// Test that large size is applied
|
|
assert!(button.class_name().contains("h-11"));
|
|
assert!(button.class_name().contains("px-8"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_icon_size() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Icon, false, "Icon Size");
|
|
|
|
// Test that icon size is applied
|
|
assert!(button.class_name().contains("h-10"));
|
|
assert!(button.class_name().contains("w-10"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_disabled_state() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, true, "Disabled Button");
|
|
|
|
// Test that disabled state is applied
|
|
assert!(button.has_attribute("disabled"));
|
|
assert!(button.class_name().contains("disabled:opacity-50"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_without_disabled_state() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Enabled Button");
|
|
|
|
// Test that disabled state is not applied
|
|
assert!(!button.has_attribute("disabled"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_custom_class() {
|
|
let button = view! {
|
|
<Button class="custom-class">
|
|
"Custom Class Button"
|
|
</Button>
|
|
}.unchecked_into();
|
|
|
|
// Test that custom class is applied
|
|
assert!(button.class_name().contains("custom-class"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_custom_id() {
|
|
let button = view! {
|
|
<Button id="custom-id">
|
|
"Custom ID Button"
|
|
</Button>
|
|
}.unchecked_into();
|
|
|
|
// Test that custom id is applied
|
|
assert_eq!(button.get_attribute("id"), Some("custom-id".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_custom_style() {
|
|
let button = view! {
|
|
<Button style="color: red; background: blue;">
|
|
"Custom Style Button"
|
|
</Button>
|
|
}.unchecked_into();
|
|
|
|
// Test that custom style is applied
|
|
assert_eq!(button.get_attribute("style"), Some("color: red; background: blue;".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_base_classes() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Base Classes");
|
|
|
|
// Test that base classes are always present
|
|
assert!(button.class_name().contains("inline-flex"));
|
|
assert!(button.class_name().contains("items-center"));
|
|
assert!(button.class_name().contains("justify-center"));
|
|
assert!(button.class_name().contains("rounded-md"));
|
|
assert!(button.class_name().contains("transition-colors"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_combined_props() {
|
|
let button = render_button_with_props(ButtonVariant::Destructive, ButtonSize::Lg, true, "Combined Props");
|
|
|
|
// Test that all props are combined correctly
|
|
assert!(button.class_name().contains("bg-destructive"));
|
|
assert!(button.class_name().contains("h-11"));
|
|
assert!(button.class_name().contains("px-8"));
|
|
assert!(button.has_attribute("disabled"));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_empty_children() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "");
|
|
|
|
// Test that empty children are handled
|
|
assert_eq!(button.text_content(), Some("".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_unicode_children() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "🚀 Button 🎉");
|
|
|
|
// Test that unicode children are handled
|
|
assert_eq!(button.text_content(), Some("🚀 Button 🎉".to_string()));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_long_children() {
|
|
let long_text = "A".repeat(1000);
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, &long_text);
|
|
|
|
// Test that long children are handled
|
|
assert_eq!(button.text_content(), Some(long_text));
|
|
}
|
|
|
|
#[wasm_bindgen_test]
|
|
fn test_button_renders_with_special_characters() {
|
|
let button = render_button_with_props(ButtonVariant::Default, ButtonSize::Default, false, "Button with <>&\"'");
|
|
|
|
// Test that special characters are handled
|
|
assert_eq!(button.text_content(), Some("Button with <>&\"'".to_string()));
|
|
}
|
|
}
|