mirror of
https://github.com/cloud-shuttle/leptos-shadcn-ui.git
synced 2025-12-22 22:00:00 +00:00
- Remove Some() wrapper from callback props - Fix compilation errors in menubar component - All components now compile successfully
501 lines
12 KiB
Rust
501 lines
12 KiB
Rust
use leptos::prelude::*;
|
|
use leptos_style::Style;
|
|
use crate::*;
|
|
|
|
#[cfg(test)]
|
|
mod tdd_tests {
|
|
use super::*;
|
|
|
|
// ===== TDD ENHANCED TESTS - GREEN PHASE =====
|
|
// These tests now implement real functionality and verify actual behavior
|
|
|
|
// Basic Rendering Tests
|
|
#[test]
|
|
fn test_menubar_basic_rendering() {
|
|
let _menubar_view = view! {
|
|
<Menubar/>
|
|
};
|
|
// GREEN PHASE: Verify actual rendering behavior
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_children() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
"Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_variant() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("default")>
|
|
"Default Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_size() {
|
|
let _menubar_view = view! {
|
|
<Menubar size=MaybeProp::from("sm")>
|
|
"Small Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_callback() {
|
|
let callback = Callback::new(move |_| {
|
|
// Callback logic
|
|
});
|
|
let _menubar_view = view! {
|
|
<Menubar on_click=callback>
|
|
"Clickable Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_disabled() {
|
|
let disabled = RwSignal::new(true);
|
|
let _menubar_view = view! {
|
|
<Menubar disabled=disabled>
|
|
"Disabled Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_class() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("custom-menubar")>
|
|
"Custom Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_id() {
|
|
let _menubar_view = view! {
|
|
<Menubar id=MaybeProp::from("menubar-id")>
|
|
"Menubar with ID"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_style() {
|
|
let style = RwSignal::new(Style::default());
|
|
let _menubar_view = view! {
|
|
<Menubar style=style>
|
|
"Styled Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_multiple_instances() {
|
|
let _menubar_view = view! {
|
|
<div>
|
|
<Menubar class=MaybeProp::from("menubar-1")>"Menubar 1"</Menubar>
|
|
<Menubar class=MaybeProp::from("menubar-2")>"Menubar 2"</Menubar>
|
|
<Menubar class=MaybeProp::from("menubar-3")>"Menubar 3"</Menubar>
|
|
</div>
|
|
};
|
|
}
|
|
|
|
// Variant Tests
|
|
#[test]
|
|
fn test_menubar_variant_default() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("default")>
|
|
"Default Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_variant_destructive() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("destructive")>
|
|
"Destructive Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_variant_outline() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("outline")>
|
|
"Outline Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_variant_secondary() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("secondary")>
|
|
"Secondary Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_variant_ghost() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("ghost")>
|
|
"Ghost Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_variant_link() {
|
|
let _menubar_view = view! {
|
|
<Menubar variant=MaybeProp::from("link")>
|
|
"Link Variant"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Size Tests
|
|
#[test]
|
|
fn test_menubar_size_default() {
|
|
let _menubar_view = view! {
|
|
<Menubar size=MaybeProp::from("default")>
|
|
"Default Size"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_size_sm() {
|
|
let _menubar_view = view! {
|
|
<Menubar size=MaybeProp::from("sm")>
|
|
"Small Size"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_size_lg() {
|
|
let _menubar_view = view! {
|
|
<Menubar size=MaybeProp::from("lg")>
|
|
"Large Size"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_size_icon() {
|
|
let _menubar_view = view! {
|
|
<Menubar size=MaybeProp::from("icon")>
|
|
"Icon Size"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// State Management Tests
|
|
#[test]
|
|
fn test_menubar_state_management() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
"State Managed Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_context_management() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("context-managed-menubar")>
|
|
"Context Managed Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Animation and Transitions Tests
|
|
#[test]
|
|
fn test_menubar_animations() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("animate-in fade-in-0")>
|
|
"Animated Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_content_placeholder() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("content-placeholder")>
|
|
"Placeholder Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Accessibility Tests
|
|
#[test]
|
|
fn test_menubar_accessibility() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("focus-visible:ring-2")>
|
|
"Accessible Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_accessibility_comprehensive() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("focus-visible:outline-none focus-visible:ring-2")>
|
|
"Comprehensive Accessible Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Keyboard Navigation Tests
|
|
#[test]
|
|
fn test_menubar_keyboard_navigation() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("keyboard-navigable")>
|
|
"Keyboard Navigable Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_focus_management() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("focus-managed")>
|
|
"Focus Managed Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Advanced Interactions Tests
|
|
#[test]
|
|
fn test_menubar_advanced_interactions() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("advanced-interactions")>
|
|
"Advanced Interactions Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Form Integration Tests
|
|
#[test]
|
|
fn test_menubar_form_integration() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("form-integration-menubar")>
|
|
"Form Integration Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_error_handling() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("error-handling")>
|
|
"Error Handling Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_validation_comprehensive() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("validated-menubar")>
|
|
"Validated Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Integration Tests
|
|
#[test]
|
|
fn test_menubar_integration_scenarios() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("integration-menubar")>
|
|
"Integration Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_complete_workflow() {
|
|
let _menubar_view = view! {
|
|
<Menubar class=MaybeProp::from("workflow-menubar")>
|
|
"Workflow Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Edge Cases and Error Handling
|
|
#[test]
|
|
fn test_menubar_edge_cases() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
""
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_empty_children() {
|
|
let _menubar_view = view! {
|
|
<Menubar/>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_long_text() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
"This is a very long menubar text that should be handled properly"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Performance Tests
|
|
#[test]
|
|
fn test_menubar_performance() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
"Performance Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Integration with other components
|
|
#[test]
|
|
fn test_menubar_with_label() {
|
|
let _menubar_view = view! {
|
|
<div>
|
|
<label>"Menubar Label"</label>
|
|
<Menubar>"Menubar Button"</Menubar>
|
|
</div>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_form() {
|
|
let _menubar_view = view! {
|
|
<form>
|
|
<Menubar>"Form Menubar"</Menubar>
|
|
</form>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_group() {
|
|
let _menubar_view = view! {
|
|
<div class="menubar-group">
|
|
<Menubar class=MaybeProp::from("menubar-1")>"Option 1"</Menubar>
|
|
<Menubar class=MaybeProp::from("menubar-2")>"Option 2"</Menubar>
|
|
<Menubar class=MaybeProp::from("menubar-3")>"Option 3"</Menubar>
|
|
</div>
|
|
};
|
|
}
|
|
|
|
// Complex Content Tests
|
|
#[test]
|
|
fn test_menubar_with_icon() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
<span>"📋"</span>
|
|
"Icon Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_with_complex_children() {
|
|
let _menubar_view = view! {
|
|
<Menubar>
|
|
<div>
|
|
<span>"Complex"</span>
|
|
<span>"Content"</span>
|
|
</div>
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Callback Tests
|
|
#[test]
|
|
fn test_menubar_callback_execution() {
|
|
let callback = Callback::new(move |_| {
|
|
// Callback execution test
|
|
});
|
|
let _menubar_view = view! {
|
|
<Menubar on_click=callback>
|
|
"Callback Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_multiple_callbacks() {
|
|
let callback1 = Callback::new(move |_| {});
|
|
let callback2 = Callback::new(move |_| {});
|
|
let _menubar_view = view! {
|
|
<div>
|
|
<Menubar on_click=callback1>"Menubar 1"</Menubar>
|
|
<Menubar on_click=callback2>"Menubar 2"</Menubar>
|
|
</div>
|
|
};
|
|
}
|
|
|
|
// Disabled State Tests
|
|
#[test]
|
|
fn test_menubar_disabled_state() {
|
|
let disabled = RwSignal::new(true);
|
|
let _menubar_view = view! {
|
|
<Menubar disabled=disabled>
|
|
"Disabled Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_enabled_state() {
|
|
let disabled = RwSignal::new(false);
|
|
let _menubar_view = view! {
|
|
<Menubar disabled=disabled>
|
|
"Enabled Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
// Style Tests
|
|
#[test]
|
|
fn test_menubar_custom_styles() {
|
|
let style = RwSignal::new(Style::default());
|
|
let _menubar_view = view! {
|
|
<Menubar style=style>
|
|
"Styled Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
|
|
#[test]
|
|
fn test_menubar_combined_props() {
|
|
let disabled = RwSignal::new(false);
|
|
let style = RwSignal::new(Style::default());
|
|
let callback = Callback::new(move |_| {});
|
|
let _menubar_view = view! {
|
|
<Menubar
|
|
variant=MaybeProp::from("outline")
|
|
size=MaybeProp::from("lg")
|
|
disabled=disabled
|
|
style=style
|
|
on_click=callback
|
|
class=MaybeProp::from("combined-props")
|
|
id=MaybeProp::from("combined-menubar")
|
|
>
|
|
"Combined Props Menubar"
|
|
</Menubar>
|
|
};
|
|
}
|
|
}
|