fix: logRoles now actually logs its output to console. (#312)

* logRoles now logs its output to console.

API is unchanged, logRoles will still return the same string, but now
also logs to the console.

#311

* logRoles no longer returns a string

logRoles now simply calls console.log.

* Added coverage for logRoles

* Fixed logRoles tests, added serializer to test env

Test now only mocks console.log once.

jest-serializer-ansi is now added to tests/setup-env.js so all snapshots
benefit from it.

Author: michaellasky

src/__tests__/__snapshots__/role-helpers.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`logRoles logs expected roles for various dom nodes 1`] = `
+exports[`logRoles calls console.log with output from prettyRoles 1`] = `
 "region:
 
 <section

src/__tests__/role-helpers.js

@@ -1,4 +1,3 @@
-import jestSerializerAnsi from 'jest-serializer-ansi'
 import {getRoles, logRoles, getImplicitAriaRoles} from '../role-helpers'
 import {render, cleanup} from './helpers/test-utils'
 
@@ -132,13 +131,18 @@ test('getRoles returns expected roles for various dom nodes', () => {
   })
 })
 
-test('logRoles logs expected roles for various dom nodes', () => {
-  expect.addSnapshotSerializer(jestSerializerAnsi)
-
+test('logRoles calls console.log with output from prettyRoles', () => {
   const {section} = setup()
-  const output = logRoles(section)
 
-  expect(output).toMatchSnapshot()
+  jest.spyOn(console, 'log').mockImplementationOnce(() => {})
+
+  logRoles(section)
+  // eslint-disable-next-line no-console
+  expect(console.log).toHaveBeenCalledTimes(1)
+  // eslint-disable-next-line no-console
+  expect(console.log.mock.calls[0][0]).toMatchSnapshot()
+  // eslint-disable-next-line no-console
+  console.log.mockRestore()
 })
 
 test('getImplicitAriaRoles returns expected roles for various dom nodes', () => {

src/role-helpers.js

@@ -74,7 +74,7 @@ function getRoles(container) {
 function logRoles(container) {
   const roles = getRoles(container)
 
-  return Object.entries(roles)
+  const rolesStr = Object.entries(roles)
     .map(([role, elements]) => {
       const delimiterBar = '-'.repeat(50)
       const elementsString = elements
@@ -84,6 +84,9 @@ function logRoles(container) {
       return `${role}:\n\n${elementsString}\n\n${delimiterBar}`
     })
     .join('\n')
+
+  // eslint-disable-next-line no-console
+  console.log(rolesStr)
 }
 
 export {getRoles, logRoles, getImplicitAriaRoles}

tests/setup-env.js

@@ -1 +1,4 @@
 import 'jest-dom/extend-expect'
+import jestSerializerAnsi from 'jest-serializer-ansi'
+
+expect.addSnapshotSerializer(jestSerializerAnsi)