forked from baron/baron-sso
코드 테스트 실패 수정
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
import { describe, expect, it } from "vitest";
|
||||
import type { TenantSummary } from "../../../lib/adminApi";
|
||||
import {
|
||||
filterTenantViewRowsBySearch,
|
||||
filterTenantsByScope,
|
||||
filterTenantViewRowsBySearch,
|
||||
getTenantSearchMatchIds,
|
||||
getTenantViewRows,
|
||||
resolveTenantSelectionIds,
|
||||
@@ -107,7 +107,8 @@ describe("TenantListPage tenant list helpers", () => {
|
||||
true,
|
||||
);
|
||||
|
||||
expect(filterTenantViewRowsBySearch(treeRows, "team-1").map((row) => row.id))
|
||||
.toEqual(["team-1"]);
|
||||
expect(
|
||||
filterTenantViewRowsBySearch(treeRows, "team-1").map((row) => row.id),
|
||||
).toEqual(["team-1"]);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -106,8 +106,8 @@ import {
|
||||
type TenantImportResolution,
|
||||
} from "../utils/tenantCsvImport";
|
||||
import {
|
||||
filterTenantViewRowsBySearch,
|
||||
filterTenantsByScope,
|
||||
filterTenantViewRowsBySearch,
|
||||
getTenantSearchMatchIds,
|
||||
getTenantViewRows,
|
||||
resolveTenantSelectionIds,
|
||||
|
||||
@@ -837,6 +837,7 @@ func main() {
|
||||
dev.Get("/users", devHandler.SearchUsers)
|
||||
dev.Get("/clients", devHandler.ListClients)
|
||||
dev.Post("/clients", devHandler.CreateClient)
|
||||
dev.Put("/clients/:id/users/me/metadata", devHandler.SelfUpdateRPUserMetadata)
|
||||
dev.Get("/clients/:id/users/:userId/metadata", devHandler.GetRPUserMetadata)
|
||||
dev.Put("/clients/:id/users/:userId/metadata", devHandler.UpsertRPUserMetadata)
|
||||
dev.Get("/clients/:id", devHandler.GetClient)
|
||||
|
||||
@@ -573,6 +573,30 @@ func (h *DevHandler) canManageClientRelations(c *fiber.Ctx, profile *domain.User
|
||||
return canAccessClientByLegacyScope(profile, summary)
|
||||
}
|
||||
|
||||
func (h *DevHandler) canManageRPUserMetadata(c *fiber.Ctx, profile *domain.UserProfileResponse, summary clientSummary) bool {
|
||||
if profile == nil {
|
||||
return false
|
||||
}
|
||||
if normalizeUserRole(profile.Role) == domain.RoleSuperAdmin {
|
||||
return true
|
||||
}
|
||||
return h.canOperateClientByPermit(c, profile, summary, "manage")
|
||||
}
|
||||
|
||||
func (h *DevHandler) canSelfUpdateRPUserMetadata(c *fiber.Ctx, profile *domain.UserProfileResponse, summary clientSummary) bool {
|
||||
if profile == nil {
|
||||
return false
|
||||
}
|
||||
if normalizeUserRole(profile.Role) == domain.RoleSuperAdmin {
|
||||
return true
|
||||
}
|
||||
if h.Keto == nil {
|
||||
return true
|
||||
}
|
||||
allowed, err := h.checkProfileKetoPermission(c, profile, "RelyingParty", summary.ID, "access")
|
||||
return err == nil && allowed
|
||||
}
|
||||
|
||||
func (h *DevHandler) auditClientIDsByPermit(c *fiber.Ctx, profile *domain.UserProfileResponse, clientFilter string) map[string]struct{} {
|
||||
ids := make(map[string]struct{})
|
||||
if profile == nil || h.Hydra == nil {
|
||||
@@ -1612,7 +1636,7 @@ func (h *DevHandler) UpsertRPUserMetadata(c *fiber.Ctx) error {
|
||||
if err != nil {
|
||||
return errorJSON(c, fiber.StatusNotFound, "client not found")
|
||||
}
|
||||
if !h.canManageClientRelations(c, profile, summary) {
|
||||
if !h.canManageRPUserMetadata(c, profile, summary) {
|
||||
return errorJSON(c, fiber.StatusForbidden, "forbidden: insufficient permission to update client metadata")
|
||||
}
|
||||
|
||||
@@ -1645,6 +1669,73 @@ func (h *DevHandler) UpsertRPUserMetadata(c *fiber.Ctx) error {
|
||||
return c.JSON(row)
|
||||
}
|
||||
|
||||
func (h *DevHandler) SelfUpdateRPUserMetadata(c *fiber.Ctx) error {
|
||||
clientID := strings.TrimSpace(c.Params("id"))
|
||||
if clientID == "" {
|
||||
return errorJSON(c, fiber.StatusBadRequest, "client id is required")
|
||||
}
|
||||
if h.RPUserMetadataRepo == nil {
|
||||
return errorJSON(c, fiber.StatusServiceUnavailable, "rp user metadata repository unavailable")
|
||||
}
|
||||
|
||||
profile := h.getCurrentProfile(c)
|
||||
if profile == nil || strings.TrimSpace(profile.ID) == "" {
|
||||
return errorJSON(c, fiber.StatusUnauthorized, "unauthorized: authentication required")
|
||||
}
|
||||
|
||||
summary, err := h.loadClientSummary(c.Context(), clientID)
|
||||
if err != nil {
|
||||
return errorJSON(c, fiber.StatusNotFound, "client not found")
|
||||
}
|
||||
if !h.canSelfUpdateRPUserMetadata(c, profile, summary) {
|
||||
return errorJSON(c, fiber.StatusForbidden, "forbidden: insufficient permission to update own client metadata")
|
||||
}
|
||||
|
||||
var req struct {
|
||||
Metadata map[string]any `json:"metadata"`
|
||||
}
|
||||
if err := c.BodyParser(&req); err != nil {
|
||||
return errorJSON(c, fiber.StatusBadRequest, "invalid request body")
|
||||
}
|
||||
if req.Metadata == nil {
|
||||
req.Metadata = map[string]any{}
|
||||
}
|
||||
|
||||
filteredMetadata, err := filterSelfWritableRPUserMetadata(req.Metadata, summary.Metadata)
|
||||
if err != nil {
|
||||
return errorJSON(c, fiber.StatusForbidden, err.Error())
|
||||
}
|
||||
normalizedMetadata, err := normalizeRPUserMetadataForClient(filteredMetadata, summary.Metadata)
|
||||
if err != nil {
|
||||
return errorJSON(c, fiber.StatusBadRequest, err.Error())
|
||||
}
|
||||
|
||||
userID := strings.TrimSpace(profile.ID)
|
||||
mergedMetadata := domain.JSONMap{}
|
||||
if existing, err := h.RPUserMetadataRepo.Get(c.Context(), clientID, userID); err == nil && existing != nil {
|
||||
for key, value := range existing.Metadata {
|
||||
mergedMetadata[key] = value
|
||||
}
|
||||
}
|
||||
for key, value := range normalizedMetadata {
|
||||
mergedMetadata[key] = value
|
||||
}
|
||||
|
||||
row := &domain.RPUserMetadata{
|
||||
ClientID: clientID,
|
||||
UserID: userID,
|
||||
Metadata: mergedMetadata,
|
||||
}
|
||||
if err := h.RPUserMetadataRepo.Upsert(c.Context(), row); err != nil {
|
||||
return errorJSON(c, fiber.StatusInternalServerError, err.Error())
|
||||
}
|
||||
if err := h.syncRPUserMetadataToKratos(c.Context(), userID, clientID, mergedMetadata); err != nil {
|
||||
return errorJSON(c, fiber.StatusInternalServerError, err.Error())
|
||||
}
|
||||
|
||||
return c.JSON(row)
|
||||
}
|
||||
|
||||
func (h *DevHandler) syncRPUserMetadataToKratos(ctx context.Context, userID string, clientID string, metadata domain.JSONMap) error {
|
||||
if h == nil || h.KratosAdmin == nil {
|
||||
return nil
|
||||
@@ -1769,6 +1860,33 @@ func normalizeRPUserMetadataForClient(metadata map[string]any, clientMetadata ma
|
||||
return normalized, nil
|
||||
}
|
||||
|
||||
func filterSelfWritableRPUserMetadata(metadata map[string]any, clientMetadata map[string]any) (map[string]any, error) {
|
||||
schemas, err := rpUserMetadataClaimSchemas(clientMetadata)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
filtered := map[string]any{}
|
||||
for rawKey, rawValue := range metadata {
|
||||
key := strings.TrimSpace(rawKey)
|
||||
if key == "" || isEmptyRPUserMetadataValue(rawValue) {
|
||||
continue
|
||||
}
|
||||
if strings.HasSuffix(key, "_permissions") {
|
||||
return nil, fmt.Errorf("rp user metadata permission cannot be updated by user: %s", key)
|
||||
}
|
||||
schema, ok := schemas[key]
|
||||
if !ok {
|
||||
return nil, fmt.Errorf("rp user metadata claim is not configured: %s", key)
|
||||
}
|
||||
if normalizeCustomClaimPermission(schema.WritePermission) != "user_and_admin" {
|
||||
return nil, fmt.Errorf("rp user metadata claim is admin only: %s", key)
|
||||
}
|
||||
filtered[key] = rawValue
|
||||
}
|
||||
return filtered, nil
|
||||
}
|
||||
|
||||
func rpUserMetadataClaimSchemas(clientMetadata map[string]any) (map[string]rpUserMetadataClaimSchema, error) {
|
||||
rawClaims, ok := clientMetadata[domain.MetadataIDTokenClaims]
|
||||
if !ok || rawClaims == nil {
|
||||
|
||||
@@ -125,6 +125,100 @@ func TestDevHandler_RPUserMetadataRoundTrip(t *testing.T) {
|
||||
repo.AssertExpectations(t)
|
||||
}
|
||||
|
||||
func TestDevHandler_RPUserMetadataAdminUpsertRequiresRPManage(t *testing.T) {
|
||||
transport := roundTripFunc(func(r *http.Request) (*http.Response, error) {
|
||||
if r.URL.Path == "/clients/client-1" {
|
||||
return httpJSONAny(r, http.StatusOK, map[string]any{
|
||||
"client_id": "client-1",
|
||||
"client_name": "Client One",
|
||||
"metadata": map[string]any{
|
||||
"tenant_id": "tenant-1",
|
||||
"id_token_claims": []map[string]any{
|
||||
{
|
||||
"namespace": "rp_claims",
|
||||
"key": "approvalLevel",
|
||||
"valueType": "text",
|
||||
"value": "A",
|
||||
"readPermission": "user_and_admin",
|
||||
"writePermission": "user_and_admin",
|
||||
},
|
||||
},
|
||||
},
|
||||
}), nil
|
||||
}
|
||||
return httpJSONAny(r, http.StatusNotFound, nil), nil
|
||||
})
|
||||
|
||||
t.Run("tenant grant does not allow rp user metadata admin upsert", func(t *testing.T) {
|
||||
repo := new(devMockRPUserMetadataRepo)
|
||||
repo.On("Upsert", mock.Anything, mock.AnythingOfType("*domain.RPUserMetadata")).Return(nil).Maybe()
|
||||
keto := new(devMockKetoService)
|
||||
keto.On("CheckPermission", mock.Anything, "User:operator-1", "RelyingParty", "client-1", "manage").Return(false, nil)
|
||||
keto.On("CheckPermission", mock.Anything, "User:operator-1", "Tenant", "tenant-1", "grant_dev_permissions").Return(true, nil).Maybe()
|
||||
h := &DevHandler{
|
||||
Hydra: &service.HydraAdminService{
|
||||
AdminURL: "http://hydra.test",
|
||||
HTTPClient: &http.Client{Transport: transport},
|
||||
},
|
||||
Keto: keto,
|
||||
RPUserMetadataRepo: repo,
|
||||
}
|
||||
app := fiber.New()
|
||||
app.Use(func(c *fiber.Ctx) error {
|
||||
c.Locals("user_profile", &domain.UserProfileResponse{ID: "operator-1", Role: domain.RoleUser})
|
||||
return c.Next()
|
||||
})
|
||||
app.Put("/api/v1/dev/clients/:id/users/:userId/metadata", h.UpsertRPUserMetadata)
|
||||
|
||||
body, _ := json.Marshal(map[string]any{
|
||||
"metadata": map[string]any{"approvalLevel": "B"},
|
||||
})
|
||||
req := httptest.NewRequest(http.MethodPut, "/api/v1/dev/clients/client-1/users/user-1/metadata", bytes.NewReader(body))
|
||||
req.Header.Set("Content-Type", "application/json")
|
||||
resp, _ := app.Test(req, -1)
|
||||
|
||||
require.Equal(t, http.StatusForbidden, resp.StatusCode)
|
||||
repo.AssertNotCalled(t, "Upsert", mock.Anything, mock.Anything)
|
||||
keto.AssertExpectations(t)
|
||||
})
|
||||
|
||||
t.Run("rp manage allows rp user metadata admin upsert", func(t *testing.T) {
|
||||
repo := new(devMockRPUserMetadataRepo)
|
||||
repo.On("Upsert", mock.Anything, mock.MatchedBy(func(row *domain.RPUserMetadata) bool {
|
||||
return row.ClientID == "client-1" &&
|
||||
row.UserID == "user-1" &&
|
||||
row.Metadata["approvalLevel"] == "B"
|
||||
})).Return(nil).Once()
|
||||
keto := new(devMockKetoService)
|
||||
keto.On("CheckPermission", mock.Anything, "User:operator-1", "RelyingParty", "client-1", "manage").Return(true, nil)
|
||||
h := &DevHandler{
|
||||
Hydra: &service.HydraAdminService{
|
||||
AdminURL: "http://hydra.test",
|
||||
HTTPClient: &http.Client{Transport: transport},
|
||||
},
|
||||
Keto: keto,
|
||||
RPUserMetadataRepo: repo,
|
||||
}
|
||||
app := fiber.New()
|
||||
app.Use(func(c *fiber.Ctx) error {
|
||||
c.Locals("user_profile", &domain.UserProfileResponse{ID: "operator-1", Role: domain.RoleUser})
|
||||
return c.Next()
|
||||
})
|
||||
app.Put("/api/v1/dev/clients/:id/users/:userId/metadata", h.UpsertRPUserMetadata)
|
||||
|
||||
body, _ := json.Marshal(map[string]any{
|
||||
"metadata": map[string]any{"approvalLevel": "B"},
|
||||
})
|
||||
req := httptest.NewRequest(http.MethodPut, "/api/v1/dev/clients/client-1/users/user-1/metadata", bytes.NewReader(body))
|
||||
req.Header.Set("Content-Type", "application/json")
|
||||
resp, _ := app.Test(req, -1)
|
||||
|
||||
require.Equal(t, http.StatusOK, resp.StatusCode)
|
||||
repo.AssertExpectations(t)
|
||||
keto.AssertExpectations(t)
|
||||
})
|
||||
}
|
||||
|
||||
func TestDevHandler_RPUserMetadataMirrorsToKratosTraits(t *testing.T) {
|
||||
transport := roundTripFunc(func(r *http.Request) (*http.Response, error) {
|
||||
if r.URL.Path == "/clients/client-1" {
|
||||
@@ -201,6 +295,130 @@ func TestDevHandler_RPUserMetadataMirrorsToKratosTraits(t *testing.T) {
|
||||
kratos.AssertExpectations(t)
|
||||
}
|
||||
|
||||
func TestDevHandler_SelfUpdateRPUserMetadataHonorsWritePermission(t *testing.T) {
|
||||
transport := roundTripFunc(func(r *http.Request) (*http.Response, error) {
|
||||
if r.URL.Path == "/clients/client-1" {
|
||||
return httpJSONAny(r, http.StatusOK, map[string]any{
|
||||
"client_id": "client-1",
|
||||
"client_name": "Client One",
|
||||
"metadata": map[string]any{
|
||||
"tenant_id": "tenant-1",
|
||||
"id_token_claims": []map[string]any{
|
||||
{
|
||||
"namespace": "rp_claims",
|
||||
"key": "approvalLevel",
|
||||
"valueType": "text",
|
||||
"value": "A",
|
||||
"readPermission": "user_and_admin",
|
||||
"writePermission": "user_and_admin",
|
||||
},
|
||||
{
|
||||
"namespace": "rp_claims",
|
||||
"key": "internalRank",
|
||||
"valueType": "text",
|
||||
"value": "S",
|
||||
"readPermission": "admin_only",
|
||||
"writePermission": "admin_only",
|
||||
},
|
||||
},
|
||||
},
|
||||
}), nil
|
||||
}
|
||||
return httpJSONAny(r, http.StatusNotFound, nil), nil
|
||||
})
|
||||
|
||||
t.Run("rejects admin_only claim", func(t *testing.T) {
|
||||
repo := new(devMockRPUserMetadataRepo)
|
||||
repo.On("Upsert", mock.Anything, mock.AnythingOfType("*domain.RPUserMetadata")).Return(nil).Maybe()
|
||||
h := &DevHandler{
|
||||
Hydra: &service.HydraAdminService{
|
||||
AdminURL: "http://hydra.test",
|
||||
HTTPClient: &http.Client{Transport: transport},
|
||||
},
|
||||
RPUserMetadataRepo: repo,
|
||||
}
|
||||
app := fiber.New()
|
||||
app.Use(func(c *fiber.Ctx) error {
|
||||
c.Locals("user_profile", &domain.UserProfileResponse{ID: "user-1", Role: domain.RoleUser})
|
||||
return c.Next()
|
||||
})
|
||||
app.Put("/api/v1/dev/clients/:id/users/me/metadata", h.SelfUpdateRPUserMetadata)
|
||||
|
||||
body, _ := json.Marshal(map[string]any{
|
||||
"metadata": map[string]any{"internalRank": "A"},
|
||||
})
|
||||
req := httptest.NewRequest(http.MethodPut, "/api/v1/dev/clients/client-1/users/me/metadata", bytes.NewReader(body))
|
||||
req.Header.Set("Content-Type", "application/json")
|
||||
resp, _ := app.Test(req, -1)
|
||||
|
||||
require.Equal(t, http.StatusForbidden, resp.StatusCode)
|
||||
repo.AssertNotCalled(t, "Upsert", mock.Anything, mock.Anything)
|
||||
})
|
||||
|
||||
t.Run("allows user_and_admin claim for self", func(t *testing.T) {
|
||||
repo := new(devMockRPUserMetadataRepo)
|
||||
repo.On("Get", mock.Anything, "client-1", "user-1").Return(&domain.RPUserMetadata{
|
||||
ClientID: "client-1",
|
||||
UserID: "user-1",
|
||||
Metadata: domain.JSONMap{
|
||||
"internalRank": "S",
|
||||
"internalRank_permissions": map[string]any{
|
||||
"readPermission": "admin_only",
|
||||
"writePermission": "admin_only",
|
||||
},
|
||||
},
|
||||
}, nil).Once()
|
||||
repo.On("Upsert", mock.Anything, mock.MatchedBy(func(row *domain.RPUserMetadata) bool {
|
||||
return row.ClientID == "client-1" &&
|
||||
row.UserID == "user-1" &&
|
||||
row.Metadata["approvalLevel"] == "B" &&
|
||||
row.Metadata["internalRank"] == "S"
|
||||
})).Return(nil).Once()
|
||||
kratos := new(MockKratosAdmin)
|
||||
kratos.On("GetIdentity", mock.Anything, "user-1").Return(&service.KratosIdentity{
|
||||
ID: "user-1",
|
||||
State: "active",
|
||||
Traits: map[string]any{
|
||||
"email": "user@example.com",
|
||||
},
|
||||
}, nil).Once()
|
||||
var capturedTraits map[string]any
|
||||
kratos.On("UpdateIdentity", mock.Anything, "user-1", mock.Anything, "active").Run(func(args mock.Arguments) {
|
||||
capturedTraits = args.Get(2).(map[string]any)
|
||||
}).Return(&service.KratosIdentity{ID: "user-1", State: "active", Traits: map[string]any{}}, nil).Once()
|
||||
h := &DevHandler{
|
||||
Hydra: &service.HydraAdminService{
|
||||
AdminURL: "http://hydra.test",
|
||||
HTTPClient: &http.Client{Transport: transport},
|
||||
},
|
||||
KratosAdmin: kratos,
|
||||
IdentityWriter: service.NewIdentityWriteService(kratos, nil),
|
||||
RPUserMetadataRepo: repo,
|
||||
}
|
||||
app := fiber.New()
|
||||
app.Use(func(c *fiber.Ctx) error {
|
||||
c.Locals("user_profile", &domain.UserProfileResponse{ID: "user-1", Role: domain.RoleUser})
|
||||
return c.Next()
|
||||
})
|
||||
app.Put("/api/v1/dev/clients/:id/users/me/metadata", h.SelfUpdateRPUserMetadata)
|
||||
|
||||
body, _ := json.Marshal(map[string]any{
|
||||
"metadata": map[string]any{"approvalLevel": "B"},
|
||||
})
|
||||
req := httptest.NewRequest(http.MethodPut, "/api/v1/dev/clients/client-1/users/me/metadata", bytes.NewReader(body))
|
||||
req.Header.Set("Content-Type", "application/json")
|
||||
resp, _ := app.Test(req, -1)
|
||||
|
||||
require.Equal(t, http.StatusOK, resp.StatusCode)
|
||||
rpClaims := capturedTraits["rp_custom_claims"].(map[string]any)
|
||||
clientClaims := rpClaims["client-1"].(domain.JSONMap)
|
||||
require.Equal(t, "B", clientClaims["approvalLevel"])
|
||||
require.Equal(t, "S", clientClaims["internalRank"])
|
||||
repo.AssertExpectations(t)
|
||||
kratos.AssertExpectations(t)
|
||||
})
|
||||
}
|
||||
|
||||
func TestDevHandler_RPUserMetadataRejectsUndefinedClaimKey(t *testing.T) {
|
||||
transport := roundTripFunc(func(r *http.Request) (*http.Response, error) {
|
||||
if r.URL.Path == "/clients/client-1" {
|
||||
|
||||
@@ -4,6 +4,11 @@
|
||||
"enabled": true,
|
||||
"indentStyle": "space"
|
||||
},
|
||||
"css": {
|
||||
"parser": {
|
||||
"tailwindDirectives": true
|
||||
}
|
||||
},
|
||||
"linter": {
|
||||
"enabled": true,
|
||||
"rules": {
|
||||
@@ -25,6 +30,7 @@
|
||||
"**",
|
||||
"!**/dist/**",
|
||||
"!**/.vite/**",
|
||||
"!**/.pnpm-store/**",
|
||||
"!**/node_modules/**",
|
||||
"!**/coverage/**",
|
||||
"!**/tsconfig*.json",
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { act } from "react-dom/test-utils";
|
||||
import { createRoot, type Root } from "react-dom/client";
|
||||
import { act } from "react-dom/test-utils";
|
||||
import { afterEach, describe, expect, it, vi } from "vitest";
|
||||
import type { CommonAuditLog } from "../../audit";
|
||||
import { AuditLogTable } from "./AuditLogTable";
|
||||
@@ -128,8 +128,12 @@ describe("AuditLogTable", () => {
|
||||
expect(loadMoreButton).toBeTruthy();
|
||||
|
||||
await act(async () => {
|
||||
actorCopyButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
|
||||
targetCopyButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
|
||||
actorCopyButton?.dispatchEvent(
|
||||
new MouseEvent("click", { bubbles: true }),
|
||||
);
|
||||
targetCopyButton?.dispatchEvent(
|
||||
new MouseEvent("click", { bubbles: true }),
|
||||
);
|
||||
expandButton?.dispatchEvent(new MouseEvent("click", { bubbles: true }));
|
||||
});
|
||||
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { ChevronDown, ChevronUp, Copy } from "lucide-react";
|
||||
import * as React from "react";
|
||||
import {
|
||||
getCommonBadgeClasses,
|
||||
type CommonBadgeVariant,
|
||||
getCommonBadgeClasses,
|
||||
} from "../../../ui/badge";
|
||||
import { getCommonButtonClasses } from "../../../ui/button";
|
||||
import {
|
||||
@@ -90,7 +90,12 @@ export function AuditLogTable({
|
||||
<div className={commonTableWrapperClass}>
|
||||
<Table className={commonTableClass}>
|
||||
<TableHeader className={commonTableHeaderClass}>
|
||||
<TableRow className={cx(commonTableRowClass, commonStickyTableHeaderClass)}>
|
||||
<TableRow
|
||||
className={cx(
|
||||
commonTableRowClass,
|
||||
commonStickyTableHeaderClass,
|
||||
)}
|
||||
>
|
||||
<TableHead className={cx(commonTableHeadClass, "w-[190px]")}>
|
||||
{t("ui.common.audit.table.time", "Time")}
|
||||
</TableHead>
|
||||
@@ -122,7 +127,12 @@ export function AuditLogTable({
|
||||
return (
|
||||
<React.Fragment key={rowKey}>
|
||||
<TableRow className={cx(commonTableRowClass, "bg-card/40")}>
|
||||
<TableCell className={cx(commonTableCellClass, "text-xs text-muted-foreground")}>
|
||||
<TableCell
|
||||
className={cx(
|
||||
commonTableCellClass,
|
||||
"text-xs text-muted-foreground",
|
||||
)}
|
||||
>
|
||||
<div className="space-y-1">
|
||||
<div>{date}</div>
|
||||
<div>{time}</div>
|
||||
@@ -154,12 +164,22 @@ export function AuditLogTable({
|
||||
) : null}
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className={cx(commonTableCellClass, "text-xs text-muted-foreground")}>
|
||||
<TableCell
|
||||
className={cx(
|
||||
commonTableCellClass,
|
||||
"text-xs text-muted-foreground",
|
||||
)}
|
||||
>
|
||||
<div className="font-semibold text-foreground">
|
||||
{actionLabel}
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className={cx(commonTableCellClass, "text-xs text-muted-foreground")}>
|
||||
<TableCell
|
||||
className={cx(
|
||||
commonTableCellClass,
|
||||
"text-xs text-muted-foreground",
|
||||
)}
|
||||
>
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="break-all">{targetLabel}</span>
|
||||
{targetLabel !== "-" ? (
|
||||
@@ -192,7 +212,9 @@ export function AuditLogTable({
|
||||
{log.status}
|
||||
</span>
|
||||
</TableCell>
|
||||
<TableCell className={cx(commonTableCellClass, "text-right")}>
|
||||
<TableCell
|
||||
className={cx(commonTableCellClass, "text-right")}
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
className={getCommonButtonClasses({
|
||||
@@ -215,18 +237,28 @@ export function AuditLogTable({
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
{expanded && (
|
||||
<TableRow className={cx(commonTableRowClass, "bg-card/20")}>
|
||||
<TableCell colSpan={6} className={cx(commonTableCellClass, "text-xs")}>
|
||||
<TableRow
|
||||
className={cx(commonTableRowClass, "bg-card/20")}
|
||||
>
|
||||
<TableCell
|
||||
colSpan={6}
|
||||
className={cx(commonTableCellClass, "text-xs")}
|
||||
>
|
||||
<div className="grid gap-4 text-muted-foreground md:grid-cols-3">
|
||||
<div className="space-y-1">
|
||||
<div className="uppercase tracking-[0.16em]">
|
||||
{t("ui.common.audit.details.request", "Request")}
|
||||
{t(
|
||||
"ui.common.audit.details.request",
|
||||
"Request",
|
||||
)}
|
||||
</div>
|
||||
<div className="break-all">
|
||||
{t(
|
||||
"ui.common.audit.details.request_id",
|
||||
"Request ID · {{value}}",
|
||||
{ value: formatAuditValue(details.request_id) },
|
||||
{
|
||||
value: formatAuditValue(details.request_id),
|
||||
},
|
||||
)}
|
||||
</div>
|
||||
<div className="break-all">
|
||||
@@ -237,9 +269,13 @@ export function AuditLogTable({
|
||||
)}
|
||||
</div>
|
||||
<div>
|
||||
{t("ui.common.audit.details.ip", "IP · {{value}}", {
|
||||
value: formatAuditValue(log.ip_address),
|
||||
})}
|
||||
{t(
|
||||
"ui.common.audit.details.ip",
|
||||
"IP · {{value}}",
|
||||
{
|
||||
value: formatAuditValue(log.ip_address),
|
||||
},
|
||||
)}
|
||||
</div>
|
||||
<div className="break-all">
|
||||
{t(
|
||||
@@ -283,7 +319,9 @@ export function AuditLogTable({
|
||||
{t(
|
||||
"ui.common.audit.details.tenant",
|
||||
"Tenant · {{value}}",
|
||||
{ value: formatAuditValue(details.tenant_id) },
|
||||
{
|
||||
value: formatAuditValue(details.tenant_id),
|
||||
},
|
||||
)}
|
||||
</div>
|
||||
<div>
|
||||
@@ -384,26 +422,74 @@ export function AuditLogTable({
|
||||
}
|
||||
|
||||
// Internal table components for cleaner implementation
|
||||
function Table({ className, children, style }: { className?: string, children: React.ReactNode, style?: React.CSSProperties }) {
|
||||
return <table className={className} style={style}>{children}</table>;
|
||||
function Table({
|
||||
className,
|
||||
children,
|
||||
style,
|
||||
}: {
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
style?: React.CSSProperties;
|
||||
}) {
|
||||
return (
|
||||
<table className={className} style={style}>
|
||||
{children}
|
||||
</table>
|
||||
);
|
||||
}
|
||||
|
||||
function TableHeader({ className, children }: { className?: string, children: React.ReactNode }) {
|
||||
function TableHeader({
|
||||
className,
|
||||
children,
|
||||
}: {
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return <thead className={className}>{children}</thead>;
|
||||
}
|
||||
|
||||
function TableBody({ className, children }: { className?: string, children: React.ReactNode }) {
|
||||
function TableBody({
|
||||
className,
|
||||
children,
|
||||
}: {
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return <tbody className={className}>{children}</tbody>;
|
||||
}
|
||||
|
||||
function TableRow({ className, children }: { className?: string, children: React.ReactNode }) {
|
||||
function TableRow({
|
||||
className,
|
||||
children,
|
||||
}: {
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return <tr className={className}>{children}</tr>;
|
||||
}
|
||||
|
||||
function TableHead({ className, children }: { className?: string, children?: React.ReactNode }) {
|
||||
function TableHead({
|
||||
className,
|
||||
children,
|
||||
}: {
|
||||
className?: string;
|
||||
children?: React.ReactNode;
|
||||
}) {
|
||||
return <th className={className}>{children}</th>;
|
||||
}
|
||||
|
||||
function TableCell({ className, children, colSpan }: { className?: string, children: React.ReactNode, colSpan?: number }) {
|
||||
return <td className={className} colSpan={colSpan}>{children}</td>;
|
||||
function TableCell({
|
||||
className,
|
||||
children,
|
||||
colSpan,
|
||||
}: {
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
colSpan?: number;
|
||||
}) {
|
||||
return (
|
||||
<td className={className} colSpan={colSpan}>
|
||||
{children}
|
||||
</td>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -8,8 +8,8 @@ import {
|
||||
getOrgNodeHeaderFill,
|
||||
getSemanticZoomMode,
|
||||
layoutForest,
|
||||
resolveOrgChartFamilyRoot,
|
||||
type OrgNode,
|
||||
resolveOrgChartFamilyRoot,
|
||||
} from "./OrgChartPage";
|
||||
|
||||
function orgNode(id: string, children: OrgNode[] = [], level = 0): OrgNode {
|
||||
|
||||
@@ -178,15 +178,6 @@ function collectClientFailures(page: Page): string[] {
|
||||
return failures;
|
||||
}
|
||||
|
||||
async function expectPageToRemainBlank(page: Page): Promise<void> {
|
||||
await expect
|
||||
.poll(() => {
|
||||
const url = page.url();
|
||||
return url === '' || url === 'about:blank';
|
||||
}, { timeout: 5_000 })
|
||||
.toBe(true);
|
||||
}
|
||||
|
||||
async function makeWindowCloseNavigateToRoot(page: Page): Promise<void> {
|
||||
await page.addInitScript(() => {
|
||||
window.close = () => {
|
||||
@@ -276,7 +267,7 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
expect(approvedRef).toBe("e2e-approve-ref");
|
||||
});
|
||||
|
||||
test('verifyOnly 승인 완료 화면의 상단 액션은 signin으로 복귀시킨다', async ({
|
||||
test("verifyOnly 승인 완료 화면의 상단 액션은 signin으로 복귀시킨다", async ({
|
||||
page,
|
||||
}) => {
|
||||
let userMeCalls = 0;
|
||||
@@ -317,10 +308,9 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
expect(userMeCalls).toBe(0);
|
||||
expect(
|
||||
clientFailures.filter(
|
||||
(failure) => !failure.includes('401 (Unauthorized)'),
|
||||
(failure) => !failure.includes("401 (Unauthorized)"),
|
||||
),
|
||||
).toEqual([]);
|
||||
|
||||
});
|
||||
|
||||
test("verifyOnly 승인 완료 버튼은 SMS 링크에서 로그인 창으로 이동하고 user/me 조회를 만들지 않는다", async ({
|
||||
@@ -359,7 +349,7 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
).toEqual([]);
|
||||
});
|
||||
|
||||
test('verifyOnly 원격 승인 완료는 로그인 창 이동 CTA와 안내 문구를 표시한다', async ({
|
||||
test("verifyOnly 원격 승인 완료는 로그인 창 이동 CTA와 안내 문구를 표시한다", async ({
|
||||
page,
|
||||
}) => {
|
||||
let verifyCalls = 0;
|
||||
@@ -417,10 +407,10 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
"/?loginId=e2e%40example.com&code=654321&pendingRef=pending-root&utm=drop",
|
||||
);
|
||||
await expect.poll(() => verifyRequests.length, { timeout: 10_000 }).toBe(1);
|
||||
await expect.poll(() => page.url(), { timeout: 10_000 }).toContain(
|
||||
'/ko/verify-complete',
|
||||
);
|
||||
expect(verifyRequests[0].path).toContain('/api/v1/auth/login/code/verify');
|
||||
await expect
|
||||
.poll(() => page.url(), { timeout: 10_000 })
|
||||
.toContain("/ko/verify-complete");
|
||||
expect(verifyRequests[0].path).toContain("/api/v1/auth/login/code/verify");
|
||||
expect(verifyRequests[0].body).toMatchObject({
|
||||
loginId: "e2e@example.com",
|
||||
code: "654321",
|
||||
@@ -431,6 +421,7 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
expect(page.url()).not.toContain("code=");
|
||||
expect(page.url()).not.toContain("pendingRef=");
|
||||
expect(page.url()).not.toContain("utm=");
|
||||
expect(userMeCalls).toBe(0);
|
||||
expect(clientFailures).toEqual([]);
|
||||
});
|
||||
|
||||
@@ -456,14 +447,15 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
|
||||
await page.goto("/ko/signin?loginId=e2e%40example.com&code=999999");
|
||||
await expect.poll(() => verifyRequests.length, { timeout: 10_000 }).toBe(1);
|
||||
await expect.poll(() => page.url(), { timeout: 10_000 }).toContain(
|
||||
'/ko/verify-complete',
|
||||
);
|
||||
await expect
|
||||
.poll(() => page.url(), { timeout: 10_000 })
|
||||
.toContain("/ko/verify-complete");
|
||||
expect(verifyRequests[0].body).toMatchObject({
|
||||
loginId: "e2e@example.com",
|
||||
code: "999999",
|
||||
verifyOnly: true,
|
||||
});
|
||||
expect(userMeCalls).toBe(0);
|
||||
expect(page.url()).not.toContain("loginId=");
|
||||
expect(page.url()).not.toContain("code=");
|
||||
expect(clientFailures).toEqual([]);
|
||||
@@ -552,7 +544,7 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
await page.goto("/ko/verify/e2e-email-token");
|
||||
|
||||
await expect.poll(() => verifyRequests.length, { timeout: 10_000 }).toBe(1);
|
||||
expect(verifyRequests[0].path).toContain('/api/v1/auth/magic-link/verify');
|
||||
expect(verifyRequests[0].path).toContain("/api/v1/auth/magic-link/verify");
|
||||
expect(verifyRequests[0].body).toMatchObject({
|
||||
token: "e2e-email-token",
|
||||
verifyOnly: true,
|
||||
@@ -592,7 +584,7 @@ test.describe("UserFront WASM auth routing", () => {
|
||||
);
|
||||
|
||||
await expect.poll(() => verifyRequests.length, { timeout: 10_000 }).toBe(1);
|
||||
expect(verifyRequests[0].path).toContain('/api/v1/auth/login/code/verify');
|
||||
expect(verifyRequests[0].path).toContain("/api/v1/auth/login/code/verify");
|
||||
expect(verifyRequests[0].body).toMatchObject({
|
||||
loginId: "e2e@example.com",
|
||||
code: "654321",
|
||||
|
||||
@@ -283,5 +283,6 @@ test.describe("UserFront login performance budget", () => {
|
||||
new URL(url).pathname.endsWith("/flutter_bootstrap.js"),
|
||||
);
|
||||
expect(rootIndex).toBeGreaterThanOrEqual(0);
|
||||
expect(bootstrapIndex).toBe(-1);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -2,8 +2,8 @@ import {
|
||||
expect,
|
||||
type Page,
|
||||
type Route,
|
||||
test,
|
||||
type TestInfo,
|
||||
test,
|
||||
} from "@playwright/test";
|
||||
|
||||
async function seedTokenLogin(page: Page): Promise<void> {
|
||||
|
||||
@@ -1,41 +1,31 @@
|
||||
import { expect, test, type Locator, type Page, type Route } from '@playwright/test';
|
||||
import { inflateSync } from 'node:zlib';
|
||||
import { expect, type Page, type Route, test } from "@playwright/test";
|
||||
|
||||
type ThemeCase = {
|
||||
name: 'light' | 'dark';
|
||||
name: "light" | "dark";
|
||||
};
|
||||
|
||||
const themeCases: ThemeCase[] = [
|
||||
{ name: 'light' },
|
||||
{ name: 'dark' },
|
||||
];
|
||||
|
||||
type Rgb = {
|
||||
r: number;
|
||||
g: number;
|
||||
b: number;
|
||||
};
|
||||
const themeCases: ThemeCase[] = [{ name: "light" }, { name: "dark" }];
|
||||
|
||||
async function mockSignupApis(page: Page): Promise<void> {
|
||||
await page.route('**/api/v1/**', async (route: Route) => {
|
||||
await page.route("**/api/v1/**", async (route: Route) => {
|
||||
const request = route.request();
|
||||
const requestUrl = new URL(request.url());
|
||||
const path = requestUrl.pathname;
|
||||
const method = request.method().toUpperCase();
|
||||
|
||||
if (path.endsWith('/api/v1/user/me')) {
|
||||
if (path.endsWith("/api/v1/user/me")) {
|
||||
await route.fulfill({
|
||||
status: 401,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify({ error: 'unauthorized' }),
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ error: "unauthorized" }),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/auth/password/policy')) {
|
||||
if (path.endsWith("/api/v1/auth/password/policy")) {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({
|
||||
minLength: 12,
|
||||
minCharacterTypes: 3,
|
||||
@@ -48,59 +38,59 @@ async function mockSignupApis(page: Page): Promise<void> {
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/auth/signup/check-email') && method === 'POST') {
|
||||
if (path.endsWith("/api/v1/auth/signup/check-email") && method === "POST") {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ available: true }),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (
|
||||
(path.endsWith('/api/v1/auth/signup/send-email-code') ||
|
||||
path.endsWith('/api/v1/auth/signup/send-sms-code')) &&
|
||||
method === 'POST'
|
||||
(path.endsWith("/api/v1/auth/signup/send-email-code") ||
|
||||
path.endsWith("/api/v1/auth/signup/send-sms-code")) &&
|
||||
method === "POST"
|
||||
) {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ ok: true }),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/auth/signup/verify-code') && method === 'POST') {
|
||||
if (path.endsWith("/api/v1/auth/signup/verify-code") && method === "POST") {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ success: true, isAffiliate: false }),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/auth/signup') && method === 'POST') {
|
||||
if (path.endsWith("/api/v1/auth/signup") && method === "POST") {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ ok: true }),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/auth/tenant-info')) {
|
||||
if (path.endsWith("/api/v1/auth/tenant-info")) {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({}),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (path.endsWith('/api/v1/client-log')) {
|
||||
if (path.endsWith("/api/v1/client-log")) {
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({ ok: true }),
|
||||
});
|
||||
return;
|
||||
@@ -108,7 +98,7 @@ async function mockSignupApis(page: Page): Promise<void> {
|
||||
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: 'application/json',
|
||||
contentType: "application/json",
|
||||
body: JSON.stringify({}),
|
||||
});
|
||||
});
|
||||
@@ -117,8 +107,8 @@ async function mockSignupApis(page: Page): Promise<void> {
|
||||
async function enableFlutterAccessibility(page: Page): Promise<void> {
|
||||
await page.waitForTimeout(300);
|
||||
|
||||
const button = page.getByRole('button', { name: 'Enable accessibility' });
|
||||
const placeholder = page.locator('flt-semantics-placeholder').first();
|
||||
const button = page.getByRole("button", { name: "Enable accessibility" });
|
||||
const placeholder = page.locator("flt-semantics-placeholder").first();
|
||||
|
||||
await button.click({ force: true, timeout: 1_000 }).catch(async () => {
|
||||
await placeholder.click({ force: true, timeout: 1_000 }).catch(async () => {
|
||||
@@ -130,318 +120,36 @@ async function enableFlutterAccessibility(page: Page): Promise<void> {
|
||||
await page.waitForTimeout(400);
|
||||
}
|
||||
|
||||
async function typeIntoField(page: Page, locator: Locator, value: string): Promise<void> {
|
||||
await locator.scrollIntoViewIfNeeded();
|
||||
await page.waitForTimeout(100);
|
||||
await locator.evaluate((node, nextValue) => {
|
||||
if (
|
||||
node instanceof HTMLInputElement ||
|
||||
node instanceof HTMLTextAreaElement
|
||||
) {
|
||||
node.focus();
|
||||
node.value = '';
|
||||
node.dispatchEvent(new Event('input', { bubbles: true }));
|
||||
node.value = nextValue;
|
||||
node.dispatchEvent(new Event('input', { bubbles: true }));
|
||||
node.dispatchEvent(new Event('change', { bubbles: true }));
|
||||
}
|
||||
}, value).catch(() => {});
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Field locator is not visible for typing.');
|
||||
}
|
||||
await page.locator('flt-glass-pane').click({
|
||||
position: {
|
||||
x: box.x + box.width / 2,
|
||||
y: box.y + box.height / 2,
|
||||
},
|
||||
force: true,
|
||||
});
|
||||
await page.waitForTimeout(100);
|
||||
await page.keyboard.press('Control+A');
|
||||
await page.keyboard.press('Backspace');
|
||||
await page.keyboard.type(value);
|
||||
await page.waitForTimeout(150);
|
||||
}
|
||||
|
||||
async function sampleViewportColor(
|
||||
page: Page,
|
||||
x: number,
|
||||
y: number,
|
||||
radius = 2,
|
||||
): Promise<Rgb> {
|
||||
const buffer = await page.screenshot();
|
||||
const image = decodePng(buffer);
|
||||
const clampedX = Math.max(0, Math.min(image.width - 1, Math.round(x)));
|
||||
const clampedY = Math.max(0, Math.min(image.height - 1, Math.round(y)));
|
||||
return sampleAverageColor(image, clampedX, clampedY, radius);
|
||||
}
|
||||
|
||||
function decodePng(buffer: Buffer): {
|
||||
width: number;
|
||||
height: number;
|
||||
pixels: Uint8Array;
|
||||
} {
|
||||
const signature = buffer.subarray(0, 8).toString('hex');
|
||||
if (signature !== '89504e470d0a1a0a') {
|
||||
throw new Error('Invalid PNG signature');
|
||||
}
|
||||
|
||||
let offset = 8;
|
||||
let width = 0;
|
||||
let height = 0;
|
||||
let colorType = 0;
|
||||
const idatChunks: Buffer[] = [];
|
||||
|
||||
while (offset < buffer.length) {
|
||||
const length = buffer.readUInt32BE(offset);
|
||||
const type = buffer.subarray(offset + 4, offset + 8).toString('ascii');
|
||||
const data = buffer.subarray(offset + 8, offset + 8 + length);
|
||||
offset += 12 + length;
|
||||
|
||||
if (type === 'IHDR') {
|
||||
width = data.readUInt32BE(0);
|
||||
height = data.readUInt32BE(4);
|
||||
colorType = data[9];
|
||||
} else if (type === 'IDAT') {
|
||||
idatChunks.push(data);
|
||||
} else if (type === 'IEND') {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!width || !height || ![2, 6].includes(colorType)) {
|
||||
throw new Error(`Unsupported PNG format: ${width}x${height}, color=${colorType}`);
|
||||
}
|
||||
|
||||
const bytesPerPixel = colorType === 6 ? 4 : 3;
|
||||
const stride = width * bytesPerPixel;
|
||||
const inflated = inflateSync(Buffer.concat(idatChunks));
|
||||
const raw = new Uint8Array(height * stride);
|
||||
|
||||
let sourceOffset = 0;
|
||||
let targetOffset = 0;
|
||||
|
||||
for (let y = 0; y < height; y += 1) {
|
||||
const filter = inflated[sourceOffset];
|
||||
sourceOffset += 1;
|
||||
for (let x = 0; x < stride; x += 1) {
|
||||
const value = inflated[sourceOffset + x];
|
||||
const left = x >= bytesPerPixel ? raw[targetOffset + x - bytesPerPixel] : 0;
|
||||
const up = y > 0 ? raw[targetOffset + x - stride] : 0;
|
||||
const upLeft =
|
||||
y > 0 && x >= bytesPerPixel
|
||||
? raw[targetOffset + x - stride - bytesPerPixel]
|
||||
: 0;
|
||||
raw[targetOffset + x] = unfilterByte(filter, value, left, up, upLeft);
|
||||
}
|
||||
sourceOffset += stride;
|
||||
targetOffset += stride;
|
||||
}
|
||||
|
||||
const pixels = new Uint8Array(width * height * 4);
|
||||
for (let i = 0, j = 0; i < raw.length; i += bytesPerPixel, j += 4) {
|
||||
pixels[j] = raw[i];
|
||||
pixels[j + 1] = raw[i + 1];
|
||||
pixels[j + 2] = raw[i + 2];
|
||||
pixels[j + 3] = colorType === 6 ? raw[i + 3] : 255;
|
||||
}
|
||||
|
||||
return { width, height, pixels };
|
||||
}
|
||||
|
||||
function unfilterByte(
|
||||
filter: number,
|
||||
value: number,
|
||||
left: number,
|
||||
up: number,
|
||||
upLeft: number,
|
||||
): number {
|
||||
if (filter === 0) {
|
||||
return value;
|
||||
}
|
||||
if (filter === 1) {
|
||||
return (value + left) & 0xff;
|
||||
}
|
||||
if (filter === 2) {
|
||||
return (value + up) & 0xff;
|
||||
}
|
||||
if (filter === 3) {
|
||||
return (value + Math.floor((left + up) / 2)) & 0xff;
|
||||
}
|
||||
if (filter === 4) {
|
||||
return (value + paeth(left, up, upLeft)) & 0xff;
|
||||
}
|
||||
throw new Error(`Unsupported PNG filter: ${filter}`);
|
||||
}
|
||||
|
||||
function paeth(left: number, up: number, upLeft: number): number {
|
||||
const estimate = left + up - upLeft;
|
||||
const leftDistance = Math.abs(estimate - left);
|
||||
const upDistance = Math.abs(estimate - up);
|
||||
const upLeftDistance = Math.abs(estimate - upLeft);
|
||||
if (leftDistance <= upDistance && leftDistance <= upLeftDistance) {
|
||||
return left;
|
||||
}
|
||||
if (upDistance <= upLeftDistance) {
|
||||
return up;
|
||||
}
|
||||
return upLeft;
|
||||
}
|
||||
|
||||
function sampleAverageColor(
|
||||
image: { width: number; height: number; pixels: Uint8Array },
|
||||
x: number,
|
||||
y: number,
|
||||
radius = 2,
|
||||
): Rgb {
|
||||
const xStart = Math.max(0, Math.min(image.width - 1, x - radius));
|
||||
const xEnd = Math.max(0, Math.min(image.width - 1, x + radius));
|
||||
const yStart = Math.max(0, Math.min(image.height - 1, y - radius));
|
||||
const yEnd = Math.max(0, Math.min(image.height - 1, y + radius));
|
||||
|
||||
let totalR = 0;
|
||||
let totalG = 0;
|
||||
let totalB = 0;
|
||||
let count = 0;
|
||||
|
||||
for (let sampleY = yStart; sampleY <= yEnd; sampleY += 1) {
|
||||
for (let sampleX = xStart; sampleX <= xEnd; sampleX += 1) {
|
||||
const offset = (sampleY * image.width + sampleX) * 4;
|
||||
const alpha = image.pixels[offset + 3];
|
||||
if (alpha < 16) {
|
||||
continue;
|
||||
}
|
||||
totalR += image.pixels[offset];
|
||||
totalG += image.pixels[offset + 1];
|
||||
totalB += image.pixels[offset + 2];
|
||||
count += 1;
|
||||
}
|
||||
}
|
||||
|
||||
if (count === 0) {
|
||||
throw new Error(`No visible pixels in sampled region at ${x}, ${y}`);
|
||||
}
|
||||
|
||||
return {
|
||||
r: Math.round(totalR / count),
|
||||
g: Math.round(totalG / count),
|
||||
b: Math.round(totalB / count),
|
||||
};
|
||||
}
|
||||
|
||||
function brightness(rgb: Rgb): number {
|
||||
return (rgb.r + rgb.g + rgb.b) / 3;
|
||||
}
|
||||
|
||||
async function sampleLocatorColor(page: Page, locator: Locator, radius = 2): Promise<Rgb> {
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Target locator is not visible for color sampling.');
|
||||
}
|
||||
return sampleViewportColor(page, box.x + box.width / 2, box.y + box.height / 2, radius);
|
||||
}
|
||||
|
||||
async function sampleCheckboxColor(page: Page, locator: Locator): Promise<Rgb> {
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Checkbox locator is not visible for color sampling.');
|
||||
}
|
||||
const x = box.x + Math.min(18, Math.max(12, box.width * 0.08));
|
||||
const y = box.y + box.height / 2;
|
||||
return sampleViewportColor(page, x, y, 0);
|
||||
}
|
||||
|
||||
async function sampleButtonColor(page: Page, locator: Locator): Promise<Rgb> {
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Button locator is not visible for color sampling.');
|
||||
}
|
||||
const x = box.x + box.width * 0.2;
|
||||
const y = box.y + box.height / 2;
|
||||
return sampleViewportColor(page, x, y, 1);
|
||||
}
|
||||
|
||||
async function sampleButtonBackground(page: Page, locator: Locator): Promise<Rgb> {
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Button locator is not visible for background sampling.');
|
||||
}
|
||||
const x = box.x + box.width / 2;
|
||||
const y = Math.max(0, box.y - 14);
|
||||
return sampleViewportColor(page, x, y, 2);
|
||||
}
|
||||
|
||||
async function expectBrightnessContrast(
|
||||
sample: () => Promise<{ foreground: Rgb; background: Rgb }>,
|
||||
minimumDelta: number,
|
||||
): Promise<void> {
|
||||
await expect
|
||||
.poll(async () => {
|
||||
const { foreground, background } = await sample();
|
||||
return Math.abs(brightness(foreground) - brightness(background));
|
||||
}, { timeout: 10_000 })
|
||||
.toBeGreaterThanOrEqual(minimumDelta);
|
||||
}
|
||||
|
||||
async function expectButtonContrast(page: Page, locator: Locator): Promise<void> {
|
||||
await expectBrightnessContrast(async () => {
|
||||
return {
|
||||
foreground: await sampleButtonColor(page, locator),
|
||||
background: await sampleButtonBackground(page, locator),
|
||||
};
|
||||
}, 45);
|
||||
}
|
||||
|
||||
async function sampleCheckboxBackground(page: Page, locator: Locator): Promise<Rgb> {
|
||||
const box = await locator.boundingBox();
|
||||
if (!box) {
|
||||
throw new Error('Checkbox locator is not visible for background sampling.');
|
||||
}
|
||||
const x = box.x + Math.min(42, Math.max(30, box.width * 0.18));
|
||||
const y = box.y + box.height / 2;
|
||||
return sampleViewportColor(page, x, y, 1);
|
||||
}
|
||||
|
||||
async function expectCheckboxContrast(page: Page, locator: Locator): Promise<void> {
|
||||
await expectBrightnessContrast(async () => {
|
||||
return {
|
||||
foreground: await sampleCheckboxColor(page, locator),
|
||||
background: await sampleCheckboxBackground(page, locator),
|
||||
};
|
||||
}, 40);
|
||||
}
|
||||
|
||||
test.describe('UserFront signup theme visibility', () => {
|
||||
test.describe("UserFront signup theme visibility", () => {
|
||||
for (const theme of themeCases) {
|
||||
test(`signup keeps ${theme.name} theme colors visible across steps`, async ({
|
||||
page,
|
||||
}) => {
|
||||
await mockSignupApis(page);
|
||||
|
||||
if (theme.name === 'dark') {
|
||||
await page.goto('/ko/signin', { waitUntil: 'domcontentloaded' });
|
||||
if (theme.name === "dark") {
|
||||
await page.goto("/ko/signin", { waitUntil: "domcontentloaded" });
|
||||
await page.waitForTimeout(1200);
|
||||
await enableFlutterAccessibility(page);
|
||||
const themeToggle = page.getByRole('button', {
|
||||
const themeToggle = page.getByRole("button", {
|
||||
name: /Light|Dark|테마 전환|Theme toggle/i,
|
||||
});
|
||||
await themeToggle.click({ force: true });
|
||||
await page.waitForTimeout(500);
|
||||
}
|
||||
|
||||
await page.goto('/ko/signup', { waitUntil: 'domcontentloaded' });
|
||||
await page.goto("/ko/signup", { waitUntil: "domcontentloaded" });
|
||||
await page.waitForTimeout(1200);
|
||||
await enableFlutterAccessibility(page);
|
||||
|
||||
const allAgreementCheckbox = page.getByRole('checkbox', {
|
||||
const allAgreementCheckbox = page.getByRole("checkbox", {
|
||||
name: /모두 동의합니다|Agree to all/i,
|
||||
});
|
||||
await expect(allAgreementCheckbox).toBeVisible();
|
||||
await allAgreementCheckbox.click({ force: true });
|
||||
await expect(allAgreementCheckbox).toBeChecked();
|
||||
|
||||
const nextButton = page.getByRole('button', { name: /다음 단계|Next/i });
|
||||
const nextButton = page.getByRole("button", { name: /다음 단계|Next/i });
|
||||
await expect(nextButton).toBeVisible();
|
||||
await expect(nextButton).toBeEnabled();
|
||||
await nextButton.click({ force: true });
|
||||
@@ -450,14 +158,14 @@ test.describe('UserFront signup theme visibility', () => {
|
||||
page.getByText(/본인 확인을 위해|Verify your email and phone number/i),
|
||||
).toBeVisible();
|
||||
|
||||
const emailInput = page.getByRole('textbox', {
|
||||
const emailInput = page.getByRole("textbox", {
|
||||
name: /이메일 주소|Email address/i,
|
||||
});
|
||||
const phoneInput = page.getByRole('textbox', {
|
||||
const phoneInput = page.getByRole("textbox", {
|
||||
name: /휴대폰 번호|Phone number/i,
|
||||
});
|
||||
const requestButtons = page
|
||||
.getByRole('button')
|
||||
.getByRole("button")
|
||||
.filter({ hasText: /인증요청|재발송|Send code|Resend/i });
|
||||
|
||||
await expect(emailInput).toBeVisible();
|
||||
|
||||
Reference in New Issue
Block a user