Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Expanded Editor silently ignores Done, Esc and click-away while the block preview re-fetches

Đang mở
  • Có gì không ổn?
#1,025 3 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
68/100
Loại issue
Lỗi
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
javascript, php
Lĩnh vực
frontend, web-dev

Hướng nghiên cứu

Tái hiện vấn đề với block.json, render.php và bản export của field-group được cung cấp, sau đó kiểm tra modal Expanded Editor trong assets/build/js/pro/acf-pro-blocks.min.js. Theo dõi cách isFetchingBlock điều khiển onRequestClose, nút Done, shouldCloseOnEsc và isDismissible. Done có nghĩa là trình chỉnh sửa có một cách thoát có thể sử dụng được trong khi preview đang được re-fetch hoặc truyền đạt rõ ràng trạng thái bận mà không âm thầm loại bỏ mọi thao tác đóng.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Describe the bug

While the Expanded Editor is open, changing a field queues a block preview re-fetch. For as long as that fetch is in flight, all three ways of closing the panel stop working at the same time: the Done button, the Escape key, and clicking outside it. The panel also sets isDismissible: false, so there is no close icon to fall back on. Nothing indicates the panel is busy (Done has no spinner and no disabled styling), so it reads as frozen rather than working. On our blocks the window lasts between 0.4 and 4.5 seconds depending on how heavy the block's preview is.

To Reproduce

Steps to reproduce the behavior:

  1. Register an ACF v3 block from block.json with a wysiwyg field (any block whose preview takes a moment to render server-side).
  2. Add the block to a page and open the Expanded Editor from the pencil in the block toolbar.
  3. Type into the wysiwyg, which queues a preview re-fetch.
  4. Immediately click Done - nothing happens.
  5. Press Escape - nothing happens.
  6. Click outside the panel - nothing happens.
  7. All three start working the moment the fetch resolves.

Expected behavior

At least one exit should work at all times. Either Done stays enabled and closes the panel, since the field values are already in the store by that point, or the busy state is made visible with a spinner or a genuinely disabled-looking button. The silent dropping of Escape and click-away is the most confusing part, as neither gives the editor any feedback at all.

Screenshots or Video

[attach a screen recording of clicking Done repeatedly with nothing happening]

Code

block.json:

{
    "name": "acf/repro-expanded-editor",
    "title": "Repro Expanded Editor",
    "description": "Minimal block to reproduce the Expanded Editor close guard.",
    "category": "widgets",
    "icon": "edit",
    "acf": {
        "blockVersion": 3,
        "mode": "preview",
        "renderTemplate": "render.php"
    },
    "supports": { "anchor": true }
}

render.php:

<div class="repro-expanded-editor">
    <?php the_field( 'body' ); ?>
</div>

Field group export:

{
    "key": "group_6b0a1c2d3e4f5",
    "title": "Repro Expanded Editor",
    "fields": [
        {
            "key": "field_6b0a1c2d3e4f6",
            "label": "Body",
            "name": "body",
            "type": "wysiwyg",
            "tabs": "visual",
            "media_upload": 0
        }
    ],
    "location": [
        [
            { "param": "block", "operator": "==", "value": "acf/repro-expanded-editor" }
        ]
    ],
    "active": true
}

Version Information:

  • WordPress Version 7.1
  • PHP Version 8.2.16
  • ACF Version ACF PRO 6.8.7
  • Browser [add yours]

Additional context

The relevant code is the Expanded Editor modal in assets/build/js/pro/acf-pro-blocks.min.js. Reading the minified bundle, four things are keyed to the same isFetchingBlock flag:

  • onRequestClose returns early while fetching with no validation errors, so click-away is dropped
  • the Done button's disabled prop is isFetchingBlock && !validationErrors
  • shouldCloseOnEsc is !isFetchingBlock || validationErrors
  • isDismissible is false

So for the duration of a fetch the modal has no exit at all. Guarding against closing mid-fetch is reasonable in itself; the problem is that every route is gated on one flag with no user-facing feedback.

In practice editors read it as a hang, click Done several times, and some reload the page and lose the edit. Our production blocks also set hideFieldsInSidebar and expandedEditorButtons: ["toolbar"], which is where we first hit this - the minimal repro above leaves them out, since the guards themselves don't reference either option.

Ngôn ngữ chính
PHP
Star
947
Fork
198
Không có pull request nào được merge trong 30 ngày

Chuẩn bị môi trường

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của AdvancedCustomFields/acf

Tất cả issue của AdvancedCustomFields/acf

Issue tương tự

Thêm issue về PHP

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.