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>
|
</span>
|
||||||
</div>
|
</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)]'}`} />
|
<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'}
|
Sync: {isOnline ? 'Active' : 'Offline'}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<button
|
<button
|
||||||
onClick={handleSync}
|
onClick={handleSync}
|
||||||
disabled={syncing}
|
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"
|
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" : ""} />
|
<RefreshCw size={18} className={syncing ? "animate-spin text-primary" : ""} />
|
||||||
@@ -668,13 +669,13 @@ export default function Home() {
|
|||||||
|
|
||||||
{/* Stock Adjustment Overlay */}
|
{/* Stock Adjustment Overlay */}
|
||||||
{selectedItem && (
|
{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="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">
|
<div className="flex justify-between items-center mb-6">
|
||||||
<h3 className="text-xl font-black tracking-tight flex items-center gap-2">
|
<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 && (
|
{!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}
|
In Stock: {selectedItem.quantity}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
@@ -704,6 +705,7 @@ export default function Home() {
|
|||||||
setSelectedItem(null);
|
setSelectedItem(null);
|
||||||
setIsEditing(false);
|
setIsEditing(false);
|
||||||
}}
|
}}
|
||||||
|
data-testid="adjustment-cancel"
|
||||||
className="p-2 hover:bg-slate-800 rounded-full"
|
className="p-2 hover:bg-slate-800 rounded-full"
|
||||||
>
|
>
|
||||||
<X size={20} />
|
<X size={20} />
|
||||||
@@ -907,6 +909,7 @@ export default function Home() {
|
|||||||
|
|
||||||
<button
|
<button
|
||||||
onClick={isEditing ? handleUpdateItem : handleAdjustStock}
|
onClick={isEditing ? handleUpdateItem : handleAdjustStock}
|
||||||
|
data-testid="adjustment-submit"
|
||||||
className={cn(
|
className={cn(
|
||||||
"w-full py-5 rounded-[1.8rem] font-black text-lg transition-all active:scale-[0.98] shadow-2xl",
|
"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" : (
|
isEditing ? "bg-slate-100 text-slate-900" : (
|
||||||
|
|||||||
Reference in New Issue
Block a user