States collapsed/open/closed doesn't work for <details>

Problem/Motivation

States API collapsed/open/closed state doesn't work for <details>.

The state API uses still '> summary a' to change the state of an an element.

Just make a form:

$form['student_type'] = array(
    '#type' => 'radios',
    '#options' => array(
      'high_school' => t('High School'),
      'undergraduate' => t('Undergraduate'),
      'graduate' => t('Graduate'),
    ),
    '#title' => t('What type of student are you?'),
  );  

$form['name'] = array(
    '#type' => 'details',
    '#title' => t('Name'),
    '#collapsible' => TRUE, // Added
    '#open' => FALSE,  // Added
    '#states' => array(
      'open' => array(
        ':input[name="student_type"]' => array('value' => 'high_school'),
      ),
    ),
  );
  
  // To make these fields required
  $form['name']['first'] = array(
    '#type' => 'textfield',
    '#title' => t('First name'),
    '#required' => TRUE, // Added
  );
  $form['name']['last'] = array(
    '#type' => 'textfield',
    '#title' => t('Last name'),
    '#required' => TRUE, // Added
  );
  
  
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Submit',
  );
  return $form;

name should be open if high_school is selected.

Proposed resolution

Change the selector in 'state:collapsed'-event from '> summary a' to '> summary'