test: add data-testid attributes to main page for E2E tests

This commit is contained in:
2026-04-19 09:31:17 +03:00
parent a8319f1580
commit 4f4822c0cb

View File

@@ -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" : (