From 5830c160f26be97541b5a4a129ced5c4ba3692dd Mon Sep 17 00:00:00 2001
From: voluntas <nakai@shiguredo.jp>
Date: Fri, 17 Nov 2023 12:08:26 +0900
Subject: [PATCH] =?UTF-8?q?a11y.useValidAnchor=20=E3=82=92=E6=9C=89?=
 =?UTF-8?q?=E5=8A=B9=E3=81=AB=E3=81=99=E3=82=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 biome.json                                     |  1 -
 src/components/DebugPane/Message.tsx           |  5 +++--
 src/components/DevtoolsPane/index.tsx          | 12 ++++++------
 src/components/Header/DownloadReportButton.tsx |  2 +-
 4 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/biome.json b/biome.json
index d1888e97..b5955d03 100644
--- a/biome.json
+++ b/biome.json
@@ -11,7 +11,6 @@
         "useExhaustiveDependencies": "off"
       },
       "a11y": {
-        "useValidAnchor": "off",
         "useAnchorContent": "off"
       }
     }
diff --git a/src/components/DebugPane/Message.tsx b/src/components/DebugPane/Message.tsx
index b2b25d1e..0af16640 100644
--- a/src/components/DebugPane/Message.tsx
+++ b/src/components/DebugPane/Message.tsx
@@ -50,7 +50,8 @@ export const Message: React.FC<Props> = (props) => {
   return (
     <div className="border border-light rounded mb-1 bg-dark" data-title={title}>
       <div className="d-flex justify-content-between align-items-center text-break">
-        <a
+        <button
+          type="button"
           className={`debug-title ${disabled ? 'disabled' : ''}`}
           onClick={() => setShow(!show)}
           aria-controls={ariaControls}
@@ -62,7 +63,7 @@ export const Message: React.FC<Props> = (props) => {
           ) : null}
           {label}
           <span>{title}</span>
-        </a>
+        </button>
         <div className="border-left">
           <CopyLogButton
             text={
diff --git a/src/components/DevtoolsPane/index.tsx b/src/components/DevtoolsPane/index.tsx
index dac1ac9f..5d1bb403 100644
--- a/src/components/DevtoolsPane/index.tsx
+++ b/src/components/DevtoolsPane/index.tsx
@@ -211,9 +211,9 @@ const RowSignalingOptions: React.FC = () => {
   return (
     <Row className="form-row">
       <Col>
-        <a href="#" className={linkClassNames.join(' ')} onClick={onClick}>
+        <button type="button" className={linkClassNames.join(' ')} onClick={onClick}>
           Signaling options
-        </a>
+        </button>
       </Col>
       <Collapse in={!collapsed}>
         <div>
@@ -261,9 +261,9 @@ const RowAdvancedSignalingOptions: React.FC = () => {
   return (
     <Row className="form-row">
       <Col>
-        <a href="#" className={linkClassNames.join(' ')} onClick={onClick}>
+        <button type="button" className={linkClassNames.join(' ')} onClick={onClick}>
           Advanced signaling options
-        </a>
+        </button>
       </Col>
       <Collapse in={!collapsed}>
         <div>
@@ -341,9 +341,9 @@ const RowMediaOptions: React.FC = () => {
   return (
     <Row className="form-row">
       <Col>
-        <a href="#" className={linkClassNames.join(' ')} onClick={onClick}>
+        <button type="button" className={linkClassNames.join(' ')} onClick={onClick}>
           Media options
-        </a>
+        </button>
       </Col>
       <Collapse in={!collapsed}>
         <div>
diff --git a/src/components/Header/DownloadReportButton.tsx b/src/components/Header/DownloadReportButton.tsx
index df6e165b..3cd50688 100644
--- a/src/components/Header/DownloadReportButton.tsx
+++ b/src/components/Header/DownloadReportButton.tsx
@@ -118,7 +118,7 @@ export const DownloadReportButton: React.FC = () => {
         defaultValue="Download report"
         onClick={onClick}
       />
-      <a ref={anchorRef} style={{ display: 'none' }} />
+      <button type="button" ref={anchorRef} style={{ display: 'none' }} />
     </>
   )
 }