AdvancedCustomFields / AdvancedCustomFields/acf

JS `acf.findFields` returns unrequested types in ACF6

Open
#765 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
PHP
Stars
945
Forks
197
PR merge metrics
No merged PRs in 30d

Description

The new Javascript API doesn't behave as expected with ACF6 (up to 6.0.5).

acf.findFields({type: 'text'})

When editing a field group, this returns other elements with data-type="tab" like this:

<div class="acf-field acf-field-tab acf-field-acf-field-group-settings-tabs"
     data-type="tab" data-key="acf_field_group_settings_tabs">

Expected result: only elements of data-type="text", not tab.

Looking at the value of the internal selector in findFields there have been some changes but we can see there's still a regression:

ACF 5.12.4 - OK
.acf-field[data-type="text"]:visible
ACF 6.0.3 - WRONG
.acf-field[data-type="text"]:visible,, .acf-field-acf-field-settings-tabs, .acf-field-acf-field-group-settings-tabs
ACF 6.0.5 - WRONG
.acf-field[data-type="text"]:visible,, .acf-field-acf-field-group-settings-tabs

By debugging the JS scripts I found the tabs are added by this find_fields_selector filter:
https://github.com/AdvancedCustomFields/acf/blob/366796a529219c1c5c2722a80371eb56a5fd1425/assets/build/js/acf-input.js#L5712-L5714

--> adds '.acf-field-acf-field-group-settings-tabs'

Why and where does it come from? I didn't set this filter, so it should not be a result of the user request.
It can be disabled by suppressFilters as a workaround but this field is not even documented. IMO it should not be set by the user to filter unexpected results. The default behavior should remain as in ACF5.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in assets/build/js/acf-input.js around findFields and the find_fields_selector filter referenced in the issue. Reproduce acf.findFields({type: 'text'}) while editing a field group, then trace why the settings-tabs selector is appended; done means the request returns only visible text fields without requiring suppressFilters.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, php
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.