[fix] - Resolve flow issues by explicitly importing types (#243)

Fixing #241

Author: leos

.flowconfig

@@ -2,6 +2,3 @@
 <PROJECT_ROOT>/lib/.*
 <PROJECT_ROOT>/docs/.*
 <PROJECT_ROOT>/reports/.*
-
-[libs]
-flow

__tests__/src/rules/no-interactive-element-to-noninteractive-role-test.js

@@ -288,6 +288,9 @@ const alwaysValid = [
   { code: '<div role="term" />;' },
   { code: '<div role="timer" />;' },
   { code: '<div role="tooltip" />;' },
+  /* Namespaced roles are not checked */
+  { code: '<div mynamespace:role="term" />' },
+  { code: '<input mynamespace:role="img" />' },
 ];
 
 const neverValid = [

flow/eslint-jsx.js

@@ -1,8 +1,11 @@
+/*
+ * @flow
+ */
 import type {
   JSXAttribute,
   JSXOpeningElement,
  } from 'ast-types-flow';
 
-type ESLintJSXAttribute = {
+export type ESLintJSXAttribute = {
   parent: JSXOpeningElement
 } & JSXAttribute;

flow/eslint.js

@@ -1,9 +1,12 @@
-type ESLintReport = {
+/*
+ * @flow
+ */
+export type ESLintReport = {
   node: any,
   message: string,
 };
 
-type ESLintContext = {
+export type ESLintContext = {
   options: Array<Object>,
   report: (ESLintReport) => void,
 };

src/rules/interactive-supports-focus.js

@@ -13,6 +13,7 @@ import {
 } from 'jsx-ast-utils';
 import type { JSXOpeningElement } from 'ast-types-flow';
 import includes from 'array-includes';
+import type { ESLintContext } from '../../flow/eslint';
 import { generateObjSchema } from '../util/schemas';
 import isHiddenFromScreenReader from '../util/isHiddenFromScreenReader';
 import isInteractiveElement from '../util/isInteractiveElement';

src/rules/media-has-caption.js

@@ -10,6 +10,7 @@
 
 import type { JSXElement, JSXOpeningElement } from 'ast-types-flow';
 import { elementType, getProp, getLiteralPropValue } from 'jsx-ast-utils';
+import type { ESLintContext } from '../../flow/eslint';
 import { generateObjSchema, arraySchema } from '../util/schemas';
 
 const errorMessage = 'Media elements such as <audio> and <video> must have a <track> for captions.';

src/rules/no-interactive-element-to-noninteractive-role.js

@@ -20,6 +20,8 @@ import {
 } from 'jsx-ast-utils';
 import type { JSXIdentifier } from 'ast-types-flow';
 import includes from 'array-includes';
+import type { ESLintContext } from '../../flow/eslint';
+import type { ESLintJSXAttribute } from '../../flow/eslint-jsx';
 import isInteractiveElement from '../util/isInteractiveElement';
 import isNonInteractiveRole from '../util/isNonInteractiveRole';
 import isPresentationRole from '../util/isPresentationRole';

src/rules/no-noninteractive-element-interactions.js

@@ -19,6 +19,7 @@ import {
 } from 'jsx-ast-utils';
 import type { JSXOpeningElement } from 'ast-types-flow';
 import includes from 'array-includes';
+import type { ESLintContext } from '../../flow/eslint';
 import { arraySchema, generateObjSchema } from '../util/schemas';
 import isAbstractRole from '../util/isAbstractRole';
 import isHiddenFromScreenReader from '../util/isHiddenFromScreenReader';

src/rules/no-noninteractive-element-to-interactive-role.js

@@ -16,11 +16,14 @@ import {
   elementType,
   getProp,
   getLiteralPropValue,
+  propName,
 } from 'jsx-ast-utils';
 import type {
   JSXIdentifier,
 } from 'ast-types-flow';
 import includes from 'array-includes';
+import type { ESLintContext } from '../../flow/eslint';
+import type { ESLintJSXAttribute } from '../../flow/eslint-jsx';
 import isNonInteractiveElement from '../util/isNonInteractiveElement';
 import isInteractiveRole from '../util/isInteractiveRole';
 
@@ -50,7 +53,7 @@ module.exports = {
       JSXAttribute: (
         attribute: ESLintJSXAttribute,
       ) => {
-        const attributeName: JSXIdentifier = attribute.name.name;
+        const attributeName: JSXIdentifier = propName(attribute);
         if (attributeName !== 'role') {
           return;
         }

src/rules/no-noninteractive-tabindex.js

@@ -11,12 +11,16 @@
 import {
   dom,
 } from 'aria-query';
+import type {
+  JSXOpeningElement,
+} from 'ast-types-flow';
 import {
   elementType,
   getProp,
   getLiteralPropValue,
 } from 'jsx-ast-utils';
 import includes from 'array-includes';
+import type { ESLintContext } from '../../flow/eslint';
 import isInteractiveElement from '../util/isInteractiveElement';
 import isInteractiveRole from '../util/isInteractiveRole';
 import { generateObjSchema, arraySchema } from '../util/schemas';