fix(plugins/plugin-client-default): don't show ? icon in default client

it doesn't really offer help, and now with the sidebar, we have a much richer way to access what the user might want, as opposed to a single fixed page

Also avoid tab-focusing on the MastheadBrand.

Also improve the consistency of focus/active outlining. We had some ancient rules that resulted in either no outline or outlines with different colors than the rest of the standard patternfly stylings.

Author: starpit

plugins/plugin-client-common/src/components/Client/TopTabStripe/index.tsx

@@ -192,7 +192,7 @@ export default class TopTabStripe extends React.PureComponent<Props> {
       <Masthead className="kui--top-tab-stripe-header">
         {this.sidebarToggle()}
         <MastheadMain className="kui--top-tab-stripe-header--main">
-          <MastheadBrand component="span" className="kui--top-tab-stripe-header--brand">
+          <MastheadBrand component="span" className="kui--top-tab-stripe-header--brand" tabIndex={-1}>
             {this.headerName()}
           </MastheadBrand>
           <MastheadContent className="kui--top-tab-stripe-header--content">{this.tabs()}</MastheadContent>

plugins/plugin-client-common/web/css/static/carbon-overrides-common.css

@@ -23,28 +23,6 @@ body td {
   transition-timing-function: var(--transition-timing-function);
 }
 
-a.bx--tabs__nav-link:focus,
-a.bx--tabs__nav-link:active {
-  outline-color: var(--color-brand-01);
-}
-
-/* mimic bx--tabs__navlink:focus */
-.kui-tab.left-tab-stripe-button:focus,
-a.kui--tab-navigatable:focus {
-  outline: 2px solid var(--color-brand-03);
-  outline-offset: -2px;
-}
-
-a.kui-new-tab__plus:focus,
-a.kui-new-tab__plus:active,
-.kui--sidecar a.graphical-icon:focus,
-.kui--sidecar a.graphical-icon:active,
-.sidecar-bottom-stripe-toolbar a.kui--tab-navigatable:focus,
-.sidecar-bottom-stripe-toolbar a.kui--tab-navigatable:active {
-  outline: 2px solid var(--color-brand-03);
-  outline-offset: -2px;
-}
-
 body[kui-theme-style] .bx--link {
   pointer-events: unset;
   touch-action: unset;

plugins/plugin-client-common/web/scss/components/DropDown/PatternFly.scss

@@ -49,12 +49,6 @@ body[kui-theme-style] {
     color: inherit;
   }
 
-  .pf-c-dropdown__toggle {
-    &:focus {
-      outline: none;
-    }
-  }
-
   .pf-c-dropdown__menu {
     max-height: 30rem;
     overflow-y: auto;

plugins/plugin-client-default/src/index.tsx

@@ -79,6 +79,7 @@ export default function renderMain(props: KuiProps) {
 
   return (
     <Kui
+      noHelp
       version={version}
       productName={productName}
       lightweightTables

plugins/plugin-core-support/src/test/core-support2/tab-navigation.ts

@@ -130,7 +130,7 @@ describe('tab navigation', function(this: Common.ISuite) {
     testSelector(TAB_BUTTON_N(1), undefined, undefined, true)
     testSelector(TAB_BUTTON_N(2))
     testSelector(tabButtonSelector)
-    testSelector('#help-button', false, undefined, true)
+    // testSelector('#help-button', false, undefined, true)
     testPromptIsSelected(true) // <-- true means we hit tab first
     it('should be the end of the full cycle', promptBetterBeFocused)
   }
@@ -154,7 +154,8 @@ describe('tab navigation', function(this: Common.ISuite) {
   /* testSelector(TAB_BUTTON_N(1))
   testSelector(TAB_BUTTON_N(2))
   testSelector(tabButtonSelector) */
+  /* removing about button
   testSelector('#help-button', true, undefined, true)
   it('should have a new About Kui top tab', () =>
-    this.app.client.$(Selectors.TOP_TAB_WITH_TITLE('Welcome to Kui')).then(_ => _.waitForDisplayed({ timeout: 5000 })))
+    this.app.client.$(Selectors.TOP_TAB_WITH_TITLE('Welcome to Kui')).then(_ => _.waitForDisplayed({ timeout: 5000 }))) */
 })

plugins/plugin-core-support/src/test/core/about.ts

@@ -15,7 +15,8 @@
  */
 import { Common, CLI, ReplExpect, Selectors, Util } from '@kui-shell/test'
 
-describe(`about command ${process.env.MOCHA_RUN_TARGET || ''}`, function(this: Common.ISuite) {
+/** xdescribe because the default client does show the <?> icon (`noHelp`) */
+xdescribe(`about command ${process.env.MOCHA_RUN_TARGET || ''}`, function(this: Common.ISuite) {
   before(Common.before(this))
   after(Common.after(this))
   Util.closeAllExceptFirstTab.bind(this)()