HTML Focusgroup attribute value rename

In a recent update to the spec (see OpenUI bug openui/open-ui#859 and spec update at https://open-ui.org/components/focusgroup.explainer/ the focusgroup direction have changed from physical descriptions "horizontal" and "vertical" to logical CSS terms that imply the direction limitations adapt to content direction: "inline" and "block". This change (my first), is a simple rename of terms "horizontal" and "vertical" to "inline" and "block" respectively. Other than the attribute value parsing changes and related enums and function names, this change does not actually [yet] consider the inline and block direction when handling directional arrow keys from user input. That will be saved for a future change. Specific changes in this CL: - `FocusgroupFlags::kHorizontal` --> `::kInline` - `FocusgroupFlags::kVertical` --> `::kBlock` - `FocusgroupFlags::kWrapHorizontally` --> `::kWrapInline` - `FocusgroupFlags::kWrapVertically` --> `::kWrapBlock` - `FocusgroupFlags::kWrapVertically` --> `::kWrapBlock` - `FocusgroupDirection::kForwardHorizontal` --> `::kForwardInline` - `FocusgroupDirection::kForwardVertical` --> `::kForwardBlock` - `FocusgroupDirection::kBackwardHorizontal` --> `::kBackwardInline` - `FocusgroupDirection::kBackwardVertical` --> `::kBackwardBlock` - `FocusgroupControllerUtils::IsDirectionHorizontal()` -> `IsDirectionInline()` - `FocusgroupControllerUtils::IsDirectionVertical()` -> `IsDirectionBlock()` A new gtest unit test is added to ensure old attribute value names are not recognized. Web tests impacted by this change are updated as well (and the corresponding spec link is also updated). Bug: 4021071 Change-Id: Ic3c9a5dc56c0d48f8c1aa5c5cec3dc70bb1f5687
web-platform-tests · May 21, 2024 · 4699aa3 · 4699aa3
1 parent aeced2f
commit 4699aa3
Show file tree

Hide file tree

Showing 32 changed files with 77 additions and 77 deletions.
diff --git a/...cus/focusgroup/tentative/backward-navigation/horizontal/ascends-to-parent-focusgroup.html b/...cus/focusgroup/tentative/backward-navigation/horizontal/ascends-to-parent-focusgroup.html
@@ -2,19 +2,19 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus ascends to parent focusgroup successfully.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup=horizontal>
+<div focusgroup=inline>
   <span id=item1 tabindex=0>item1</span>
   <div id=item2 tabindex=-1>
     <div>
-      <div focusgroup="extend vertical">
+      <div focusgroup="extend block">
         <span id=item3 tabindex=-1>item3</span>
         <span id=item4 tabindex=-1>item4</span>
       </div>

diff --git a/...ative/backward-navigation/horizontal/does-not-ascend-out-of-non-extending-focusgroup.html b/...ative/backward-navigation/horizontal/does-not-ascend-out-of-non-extending-focusgroup.html
@@ -2,17 +2,17 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not ascend out of current focusgroup if it does not extend the parent focusgroup.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<ul focusgroup=horizontal>
+<ul focusgroup=inline>
   <li id=item1 tabindex="-1">
-    <ul focusgroup=vertical>
+    <ul focusgroup=block>
       <li id=item2 tabindex="-1">item2</li>
     </ul>
   </li>

diff --git a/...group/tentative/backward-navigation/horizontal/does-not-move-when-axis-not-supported.html b/...group/tentative/backward-navigation/horizontal/does-not-move-when-axis-not-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not move to previous focusgroup item when the axis of the arrow key pressed isn't supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=vertical>
+<div id=root focusgroup=block>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...focusgroup/tentative/backward-navigation/horizontal/does-not-wrap-in-orthogonal-axis.html b/...focusgroup/tentative/backward-navigation/horizontal/does-not-wrap-in-orthogonal-axis.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not wrap in the arrow key pressed orthogonal axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup="vertical wrap">
+<div focusgroup="block wrap">
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
   <span id=item3 tabindex=-1>item3</span>

diff --git a/...roup/tentative/backward-navigation/horizontal/moves-when-only-current-axis-supported.html b/...roup/tentative/backward-navigation/horizontal/moves-when-only-current-axis-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous focusgroup item when only the axis of the arrow key pressed is supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=horizontal>
+<div id=root focusgroup=inline>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis-complex-case.html b/...-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis-complex-case.html
@@ -2,7 +2,7 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous item, skipping the focusgroup that extends in the orthogonal axis (complex case).</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
@@ -13,7 +13,7 @@
 <div focusgroup=wrap>
   <span id=item1 tabindex=0>item1</span>
   <div>
-    <div focusgroup="extend vertical">
+    <div focusgroup="extend block">
       <div id=item2 tabindex=-1>
         <div focusgroup=extend>
           <span id=item3 tabindex=-1>item3</span>

diff --git a/...tive/backward-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis.html b/...tive/backward-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis.html
@@ -2,7 +2,7 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous item, skipping the focusgroup that extends in the orthogonal axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
@@ -13,7 +13,7 @@
 <div focusgroup=wrap>
   <span id=item1 tabindex=0>item1</span>
   <div>
-    <div focusgroup="extending vertical">
+    <div focusgroup="extend block">
       <span id=item2 tabindex=-1>item2</span>
       <span id=item3 tabindex=-1>item3</span>
     </div>

diff --git a/.../interaction/focus/focusgroup/tentative/backward-navigation/horizontal/wraps-in-axis.html b/.../interaction/focus/focusgroup/tentative/backward-navigation/horizontal/wraps-in-axis.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus wraps in the arrow key pressed axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup="horizontal wrap">
+<div focusgroup="inline wrap">
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
   <span id=item3 tabindex=-1>item3</span>

diff --git a/...focus/focusgroup/tentative/backward-navigation/vertical/ascends-to-parent-focusgroup.html b/...focus/focusgroup/tentative/backward-navigation/vertical/ascends-to-parent-focusgroup.html
@@ -2,19 +2,19 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus ascends to parent focusgroup successfully.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup=vertical>
+<div focusgroup=block>
   <span id=item1 tabindex=0>item1</span>
   <div id=item2 tabindex=-1>
     <div>
-      <div focusgroup="extend horizontal">
+      <div focusgroup="extend inline">
         <span id=item3 tabindex=-1>item3</span>
         <span id=item4 tabindex=-1>item4</span>
       </div>

diff --git a/...ntative/backward-navigation/vertical/does-not-ascend-out-of-non-extending-focusgroup.html b/...ntative/backward-navigation/vertical/does-not-ascend-out-of-non-extending-focusgroup.html
@@ -2,17 +2,17 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not ascend out of current focusgroup if it does not extend the parent focusgroup.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<ul focusgroup=vertical>
+<ul focusgroup=block>
   <li id=item1 tabindex="-1">
-    <ul focusgroup=horizontal>
+    <ul focusgroup=inline>
       <li id=item2 tabindex="-1">item2</li>
     </ul>
   </li>

diff --git a/...usgroup/tentative/backward-navigation/vertical/does-not-move-when-axis-not-supported.html b/...usgroup/tentative/backward-navigation/vertical/does-not-move-when-axis-not-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not move to previous focusgroup item when the axis of the arrow key pressed isn't supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=horizontal>
+<div id=root focusgroup=inline>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...s/focusgroup/tentative/backward-navigation/vertical/does-not-wrap-in-orthogonal-axis.html b/...s/focusgroup/tentative/backward-navigation/vertical/does-not-wrap-in-orthogonal-axis.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not wrap in the arrow key pressed orthogonal axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup="horizontal wrap">
+<div focusgroup="inline wrap">
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
   <span id=item3 tabindex=-1>item3</span>

diff --git a/...sgroup/tentative/backward-navigation/vertical/moves-when-only-current-axis-supported.html b/...sgroup/tentative/backward-navigation/vertical/moves-when-only-current-axis-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous focusgroup item when only the axis of the arrow key pressed is supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=vertical>
+<div id=root focusgroup=block>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...rd-navigation/vertical/skips-focusgroup-that-extends-in-orthogonal-axis-complex-case.html b/...rd-navigation/vertical/skips-focusgroup-that-extends-in-orthogonal-axis-complex-case.html
@@ -2,7 +2,7 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous item, skipping the focusgroup that extends in the orthogonal axis (complex case).</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
@@ -13,7 +13,7 @@
 <div focusgroup=wrap>
   <span id=item1 tabindex=0>item1</span>
   <div>
-    <div focusgroup="extend horizontal">
+    <div focusgroup="extend inline">
       <div id=item2 tabindex=-1>
         <div focusgroup=extend>
           <span id=item3 tabindex=-1>item3</span>

diff --git a/...tative/backward-navigation/vertical/skips-focusgroup-that-extends-in-orthogonal-axis.html b/...tative/backward-navigation/vertical/skips-focusgroup-that-extends-in-orthogonal-axis.html
@@ -2,7 +2,7 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to previous item, skipping the focusgroup that extends in the orthogonal axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
@@ -13,7 +13,7 @@
 <div focusgroup=wrap>
   <span id=item1 tabindex=0>item1</span>
   <div>
-    <div focusgroup="extending horizontal">
+    <div focusgroup="extend inline">
       <span id=item2 tabindex=-1>item2</span>
       <span id=item3 tabindex=-1>item3</span>
     </div>

diff --git a/html/interaction/focus/focusgroup/tentative/backward-navigation/vertical/wraps-in-axis.html b/html/interaction/focus/focusgroup/tentative/backward-navigation/vertical/wraps-in-axis.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus wraps in the arrow key pressed axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div focusgroup="vertical wrap">
+<div focusgroup="block wrap">
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
   <span id=item3 tabindex=-1>item3</span>

diff --git a/...roup/tentative/forward-navigation/horizontal/descends-in-horizontal-inner-focusgroup.html b/...roup/tentative/forward-navigation/horizontal/descends-in-horizontal-inner-focusgroup.html
@@ -2,17 +2,17 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus descends from vertical focusgroup into horizontal focusgroup.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=fg1 focusgroup=vertical>
+<div id=fg1 focusgroup=block>
   <span id=item1 tabindex=0>item1</span>
-  <div id=fg2 tabindex=-1 focusgroup="extend horizontal">
+  <div id=fg2 tabindex=-1 focusgroup="extend inline">
     <span id=item2 tabindex=-1>item2</span>
   </div>
 </div>

diff --git a/...sgroup/tentative/forward-navigation/horizontal/does-not-move-when-axis-not-supported.html b/...sgroup/tentative/forward-navigation/horizontal/does-not-move-when-axis-not-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus does not move to next focusgroup item when the axis of the arrow key pressed isn't supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=vertical>
+<div id=root focusgroup=block>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...tentative/forward-navigation/horizontal/does-not-wrap-even-when-other-axis-supported.html b/...tentative/forward-navigation/horizontal/does-not-wrap-even-when-other-axis-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Does not wrap when the arrow keypress is supported but the focusgroup only wraps in the other axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup="vertical wrap">
+<div id=root focusgroup="block wrap">
   <span id=item1 tabindex=0>item1</span>
   <div id=item2 tabindex=-1 focusgroup=extend>
     <!--This focusgroup supports both axes, but only wraps in the vertical one.-->

diff --git a/...group/tentative/forward-navigation/horizontal/moves-when-only-current-axis-supported.html b/...group/tentative/forward-navigation/horizontal/moves-when-only-current-axis-supported.html
@@ -2,15 +2,15 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to next focusgroup item when only the axis of the arrow key pressed is supported.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
 <script src="/resources/testdriver-vendor.js"></script>
 <script src="/resources/testdriver-actions.js"></script>
 <script src="../../resources/focusgroup-utils.js"></script>
 
-<div id=root focusgroup=horizontal>
+<div id=root focusgroup=inline>
   <span id=item1 tabindex=0>item1</span>
   <span id=item2 tabindex=-1>item2</span>
 </div>

diff --git a/...ative/forward-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis.html b/...ative/forward-navigation/horizontal/skips-focusgroup-that-extends-in-orthogonal-axis.html
@@ -2,7 +2,7 @@
 <meta charset="utf-8">
 <title>HTML Test: focusgroup - Focus moves to next item, skipping the focusgroup that extends in the orthogonal axis.</title>
 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
-<link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Focusgroup/explainer.md">
+<link rel="help" href="https://open-ui.org/components/focusgroup.explainer/">
 <script src="/resources/testharness.js"></script>
 <script src="/resources/testharnessreport.js"></script>
 <script src="/resources/testdriver.js"></script>
@@ -11,7 +11,7 @@
 <script src="../../resources/focusgroup-utils.js"></script>
 
 <div id=root focusgroup>
-  <div id=item1 tabindex=0 focusgroup="extend vertical">
+  <div id=item1 tabindex=0 focusgroup="extend block">
     <span id=item2 tabindex=-1>item2</span>
   </div>
   <span id=item3 tabindex=-1>item3</span>