• Resolved Hans Morbach

    (@hansmorb)


    Hey, I hope this is the right place to report this but I am suspecting that the backend UI change broke something about CMB2 checkboxes. We are using CMB2 as a composer package in our plugin and the checkboxes behave weirdly in the newest RC of WordPress 7.

    I also tested it on bare CMB2 and made a little video to illustrate the issue. Here are the steps to reproduce the issue:

    1. Start WP instance on 7.0 Beta 6
    2. Install CMB2 plugin
    3. Add following code snippet:

    add_action( 'cmb2_admin_init', 'cmb2_sample_metaboxes' );
    /**
    * Define the metabox and field configurations.
    */
    function cmb2_sample_metaboxes() {

    /**
    * Initiate the metabox
    */
    $cmb = new_cmb2_box( array(
    'id' => 'test_metabox',
    'title' => __( 'Test Metabox', 'cmb2' ),
    'object_types' => array( 'page', ), // Post type
    'context' => 'normal',
    'priority' => 'high',
    'show_names' => true, // Show field names on the left
    // 'cmb_styles' => false, // false to disable the CMB stylesheet
    // 'closed' => true, // Keep the metabox closed by default
    ) );

    // Regular text field
    $cmb->add_field( array(
    'name' => __( 'Test Checkbox', 'cmb2' ),
    'desc' => __( 'field description (optional)', 'cmb2' ),
    'id' => 'test_checkone',
    'type' => 'checkbox',
    ) );

    // Regular text field
    $cmb->add_field( array(
    'name' => __( 'Test Checkbox two', 'cmb2' ),
    'desc' => __( 'field description (optional)', 'cmb2' ),
    'id' => 'test_checktwo',
    'type' => 'checkbox',
    ) );

    // Add other metaboxes as needed

    }

    4. Edit page and observe weird behaviour in metabox as shown in the video.

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Contributor Michael Beckwith

    (@tw2113)

    The BenchPresser

    @jtsternberg I’m managing to recreate some definite oddities with checkboxes in WP admin.

    Even clicking directly on the checkbox isn’t immediately toggling the checked state.

    Plugin Contributor Michael Beckwith

    (@tw2113)

    The BenchPresser

    @hansmorb I think this may be more a focus styles thing than a “checked” state thing. Once I keyboard tab away from a checkbox, it appears like it should and the state gets appropriately handled for say saving an option.

    Edit: I believe it’s from .cmb2-wrap input:focus, .cmb2-wrap textarea:focus{ background: #fffff8;} around line 77 of cmb2.css

    Plugin Contributor Michael Beckwith

    (@tw2113)

    The BenchPresser

    Overwriting appears to work with:

    .cmb2-wrap input:focus, .cmb2-wrap textarea:focus {
    background: inherit;
    }

    .cmb2-wrap input:checked, .cmb2-wrap textarea:checked {
    background: var(--wp-admin-theme-color);
    }

    Though you’ll likely want a stronger selector if you don’t want to use !important

    Thread Starter Hans Morbach

    (@hansmorb)

    WP 7 is out and the problem unfortunately still persists. Should I try to fix this with custom CSS in our plugin or can we expect a fix from your side?

    Plugin Contributor Michael Beckwith

    (@tw2113)

    The BenchPresser

    Probably best to create a quick admin css override with my findings above, unless you want to hold on upgrading. I don’t know how soon anything may come out for a fix in the core library/plugin, as I’m primarily just forum support for it.

    Thread Starter Hans Morbach

    (@hansmorb)

    But does the dev team know about it? Because I think with the publishing of this release more complaints will probably trickle in.

    Plugin Contributor Michael Beckwith

    (@tw2113)

    The BenchPresser

    Yes it’s been reported. We’ll deal with support as needed 🙂

    Definitely appreciate the consideration/concern on that part, don’t get me wrong.

    Thread Starter Hans Morbach

    (@hansmorb)

    This seems to have been fixed /w CMB2 2.12.0. Thank you!

Viewing 8 replies - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.