test: add data-testid attributes to main page for E2E tests
This commit is contained in:
@@ -562,17 +562,18 @@ export default function Home() {
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-center gap-2" data-testid={!isOnline ? "offline-indicator" : undefined}>
|
||||
<div className={`w-1.5 h-1.5 rounded-full ${isOnline ? 'bg-green-500 animate-pulse shadow-[0_0_8px_rgba(34,197,94,0.6)]' : 'bg-rose-500 shadow-[0_0_8px_rgba(244,63,94,0.6)]'}`} />
|
||||
<span className={`text-xs font-black whitespace-nowrap ${isOnline ? 'text-green-500/90' : 'text-rose-500/90'}`}>
|
||||
<span className={`text-xs font-black whitespace-nowrap ${isOnline ? 'text-green-500/90' : 'text-rose-500/90'}`} data-testid={!isOnline ? "offline-sync-indicator" : undefined}>
|
||||
Sync: {isOnline ? 'Active' : 'Offline'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<button
|
||||
onClick={handleSync}
|
||||
<button
|
||||
onClick={handleSync}
|
||||
disabled={syncing}
|
||||
data-testid="manual-sync-button"
|
||||
className="p-2.5 bg-surface border border-slate-800 text-secondary rounded-xl hover:text-white transition-all active:scale-95 disabled:opacity-50"
|
||||
>
|
||||
<RefreshCw size={18} className={syncing ? "animate-spin text-primary" : ""} />
|
||||
@@ -668,13 +669,13 @@ export default function Home() {
|
||||
|
||||
{/* Stock Adjustment Overlay */}
|
||||
{selectedItem && (
|
||||
<div className="fixed inset-0 z-50 flex items-end sm:items-center justify-center p-4 bg-background/80 animate-in fade-in duration-200">
|
||||
<div data-testid="stock-adjustment-form" className="fixed inset-0 z-50 flex items-end sm:items-center justify-center p-4 bg-background/80 animate-in fade-in duration-200">
|
||||
<div className="w-full max-w-lg bg-surface border border-slate-800 rounded-[2.5rem] shadow-2xl p-6 overflow-hidden animate-in slide-in-from-bottom-10 duration-300">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h3 className="text-xl font-black tracking-tight flex items-center gap-2">
|
||||
{isEditing ? "Edit Metadata" : selectedItem.name}
|
||||
<span data-testid="adjustment-item-name">{isEditing ? "Edit Metadata" : selectedItem.name}</span>
|
||||
{!isEditing && (
|
||||
<span className="text-[11px] bg-slate-800 text-secondary px-2 py-0.5 rounded-md font-black tracking-tight shadow-sm border border-slate-700/50">
|
||||
<span data-testid="current-quantity" className="text-[11px] bg-slate-800 text-secondary px-2 py-0.5 rounded-md font-black tracking-tight shadow-sm border border-slate-700/50">
|
||||
In Stock: {selectedItem.quantity}
|
||||
</span>
|
||||
)}
|
||||
@@ -704,6 +705,7 @@ export default function Home() {
|
||||
setSelectedItem(null);
|
||||
setIsEditing(false);
|
||||
}}
|
||||
data-testid="adjustment-cancel"
|
||||
className="p-2 hover:bg-slate-800 rounded-full"
|
||||
>
|
||||
<X size={20} />
|
||||
@@ -907,6 +909,7 @@ export default function Home() {
|
||||
|
||||
<button
|
||||
onClick={isEditing ? handleUpdateItem : handleAdjustStock}
|
||||
data-testid="adjustment-submit"
|
||||
className={cn(
|
||||
"w-full py-5 rounded-[1.8rem] font-black text-lg transition-all active:scale-[0.98] shadow-2xl",
|
||||
isEditing ? "bg-slate-100 text-slate-900" : (
|
||||
|
||||
Reference in New Issue
Block a user