Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When I report with severity error, I get JSON serialization errors for the DOM node #158

Open
kldavis4 opened this issue Nov 30, 2018 · 1 comment

Comments

@kldavis4
Copy link

es6.promise.js:116 Uncaught TypeError: Converting circular structure to JSON
    at JSON.stringify (<anonymous>)
    at console.window.console.error (<anonymous>:39:101)
    at es6.promise.js:110
    at module.exports (_perform.js:3)
    at es6.promise.js:104
    at module.exports (_invoke.js:5)
    at queue.(:3000/anonymous function) (http://localhost:3000/main.bundle.js:128224:7)
    at Number.run (_task.js:21)
    at MessagePort.listener (_task.js:25)

Unhandled promise rejection Error: [react-a11y]: Button - You have an `onClick` handler but did not define an `onKeyDown`, `onKeyUp` or `onKeyPress` handler. Add it, and have the "Space" key do the same thing as an `onClick` handler. See 'https://www.w3.org/WAI/GL/wiki/Making_actions_keyboard_accessible_by_using_keyboard_event_handlers_with_WAI-ARIA_controls' for more info. Element: 
  <button aria-controls="gadgetSelectionPanel" aria-expanded="false" type="submit"><div class="md-ink-container"></div><i aria-hidden="true" class="md-icon material-icons icon icon--default button__icon">add</i><span class="button__label">Add Item</span></button>
    at throwError (options.js:96)
    at options.js:146
    at A11y.<anonymous> (a11y.js:190)
    at Suite._callee$ (test.js:229)
    at tryCatch (runtime.js:62)
    at Generator.invoke [as _invoke] (runtime.js:296)
    at Generator.prototype.(:3000/anonymous function) [as next] (http://localhost:3000/main.bundle.js:284032:21)
    at step (asyncToGenerator.js:17)
    at asyncToGenerator.js:28
    at run (es6.promise.js:75)
    at es6.promise.js:92
    at MutationObserver.flush (_microtask.js:18)
    at MutationObserver.nrWrapper ((index):19)

Here is my config:

  a11y(React, ReactDOM, {
    filterFn: (componentName, elementId, msg) => {
      switch (componentName) {
        // Ignore react-md components
        case 'AccessibleFakeButton':
        case 'FieldCell':
        case 'FontIcon':
        case 'Overlay':
        case 'SelectionControl':
        case 'SelectionControlGroup':
        case 'TextField':
        case 'TransitionGroup':
          return false
        default:
          return true
      }
    },
    rules: {
      'aria-role': 'error',
      'aria-unsupported-elements': 'error',
      'click-events-have-key-events': 'error',
      'hidden-uses-tabindex': 'error',
      'img-redundant-alt': 'error',
      'img-uses-alt': 'error',
      'interactive-supports-focus': 'error',
      'label-has-for': 'error',
      'mouse-events-have-key-events': 'error',
      'no-access-key': 'error',
      'no-hash-ref': 'error',
      'no-onchange': 'error',
      'onclick-uses-role': 'error',
      'tabindex-no-positive': 'error',
      'tabindex-uses-button': 'error'
    }
  })

This is in a current version of Chrome on OSX

@erin-doyle
Copy link
Collaborator

@kldavis4 I don't have enough info from this stacktrace to have any ideas as to what the problem is. I'm not sure if perhaps there is some series of promises that your code is in at the time the react-a11y error is thrown that causes problems. Can you try turning off all of the rules and turning them each on one by one to see if the issue has to do with a certain rule or a certain block of your code that is triggering the error that is causing the problem?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants