feat: Allows onError callback to not use event handler (#98)

Author: pan-kot

fixtures/components/error-boundary/error-boundary/index.tsx

@@ -0,0 +1,23 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import * as React from 'react';
+import { NonCancelableEventHandler } from '../../internal/events';
+
+export interface ErrorBoundaryProps {
+  /**
+   * React content.
+   */
+  children: React.ReactNode;
+  /**
+   * A special callback that fires when an error is captured.
+   */
+  onError: (error: Error, errorInfo: React.ErrorInfo) => void;
+  /**
+   * A callback that fires when the user clicks on the refresh button.
+   */
+  onRefresh?: NonCancelableEventHandler;
+}
+
+export default function ErrorBoundary({ children }: ErrorBoundaryProps): JSX.Element {
+  return <div>{children}</div>;
+}

fixtures/components/error-boundary/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "."
+  },
+  "include": ["./**/*.tsx"]
+}

src/components/component-definition.ts

@@ -44,9 +44,16 @@ export function buildComponentDefinition(
   checker: ts.TypeChecker
 ): ComponentDefinition {
   const regions = props.filter(prop => prop.type === 'React.ReactNode');
-  const events = props.filter(prop => prop.name.match(/^on[A-Z]/));
+  const events = props.filter(prop => {
+    // The onError event handler of the error boundary component does not follow the
+    // event handlers convention and is categorized to properties instead.
+    if (name === 'ErrorBoundary' && prop.name === 'onError') {
+      return false;
+    } else {
+      return prop.name.match(/^on[A-Z]/);
+    }
+  });
   const onlyProps = props.filter(prop => !events.includes(prop) && !regions.includes(prop));
-
   return {
     name,
     dashCaseName,

test/components/__snapshots__/error-boundary.test.ts.snap

@@ -0,0 +1,66 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`Error boundary > should have correct properties definitions 1`] = `
+[
+  {
+    "dashCaseName": "error-boundary",
+    "description": undefined,
+    "events": [
+      {
+        "cancelable": false,
+        "deprecatedTag": undefined,
+        "description": "A callback that fires when the user clicks on the refresh button.",
+        "detailInlineType": undefined,
+        "detailType": undefined,
+        "name": "onRefresh",
+        "systemTags": undefined,
+      },
+    ],
+    "functions": [],
+    "name": "ErrorBoundary",
+    "properties": [
+      {
+        "analyticsTag": undefined,
+        "defaultValue": undefined,
+        "deprecatedTag": undefined,
+        "description": "A special callback that fires when an error is captured.",
+        "i18nTag": undefined,
+        "inlineType": {
+          "name": "(error: Error, errorInfo: React.ErrorInfo) => void",
+          "parameters": [
+            {
+              "name": "error",
+              "type": "Error",
+            },
+            {
+              "name": "errorInfo",
+              "type": "React.ErrorInfo",
+            },
+          ],
+          "returnType": "void",
+          "type": "function",
+        },
+        "name": "onError",
+        "optional": false,
+        "systemTags": undefined,
+        "type": "(error: Error, errorInfo: React.ErrorInfo) => void",
+        "visualRefreshTag": undefined,
+      },
+    ],
+    "regions": [
+      {
+        "deprecatedTag": undefined,
+        "description": "React content.",
+        "displayName": undefined,
+        "i18nTag": undefined,
+        "isDefault": true,
+        "name": "children",
+        "systemTags": undefined,
+        "visualRefreshTag": undefined,
+      },
+    ],
+    "releaseStatus": "stable",
+    "systemTags": undefined,
+  },
+]
+`;

test/components/error-boundary.test.ts

@@ -0,0 +1,12 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import { describe, expect, test } from 'vitest';
+import { buildProject } from './test-helpers';
+
+describe('Error boundary', () => {
+  test('should have correct properties definitions', () => {
+    const result = buildProject('error-boundary');
+    expect(result).toMatchSnapshot();
+  });
+});