// These are ways of being able to identify HTML elements to interact with and check.
const selectors = {
  wrappers: { // class names!!!
    'Page content': 'page-content',
    'Sign In form': 'sign-in-form',
    'User registration form': 'registration-form',
    'Password recovery form': 'password-recovery-form',
    'Service Policy form': 'service-policy-form',
    'Feedback form': 'feedback-form',
    'Error message': 'error',
    'jsonView': 'react-json-view',
  },
  inputs: {
    'Your name': 'input[name="user_name"]',
    'Email': 'input[name="email"]',
    'Password': 'input[name="password"]',
    'Confirm password': 'input[name="password_confirm"]',
    'Accept Service Policy': 'input[type=checkbox][name="userconsent"]',
    'Remember me': 'input[type=checkbox][name="remember_me"]',
    'Message': 'textarea[name="message"]',
  },
  radio_groups: {
    'Section': {
      //name: 'section',
      options: {
        'User support': 'input[type=radio][name=section][value=users]',
        'Partnership': 'input[type=radio][name=section][value=partners]',
      }
    },
  },
  checkbox_groups: {
    'Required types of support': {
      //name: 'support_type',
      options: {
        'Consulting on product': 'input[type=checkbox][name=support_type][value=product]',
        'Technical support': 'input[type=checkbox][name=support_type][value=technical]',
        'Legal support': 'input[type=checkbox][name=support_type][value=legal]',
      }
    }
  },
};

module.exports = selectors;