Improve aria labels on expand/collapse buttons further

Author: pimterry

src/components/view/http/header-details.tsx

@@ -231,7 +231,7 @@ export const HeaderDetails = inject('accountStore')(observer((props: {
             )
 
             return <CollapsibleSection
-                contentName='header details'
+                contentName={`${key} header details`}
                 withinGrid={true}
                 key={`${key}-${i}`}
             >
@@ -254,7 +254,7 @@ const PseudoHeaderDetails = observer((props: {
     return <HeadersGrid>
         { _.flatMap(props.headers, ([key, value], i) => {
             return <CollapsibleSection
-                contentName='header details'
+                contentName={`${key} header details`}
                 withinGrid={true}
                 key={`${key}-${i}`}>
                 <HeaderKeyValue headerKey={key} headerValue={value} />

src/components/view/http/http-request-card.tsx

@@ -104,7 +104,7 @@ const RawRequestDetails = (p: {
     ].filter(d => !!d);
 
     return <div>
-        <CollapsibleSection contentName='method details'>
+        <CollapsibleSection contentName={`${p.request.method} method documentation`}>
             <CollapsibleSectionSummary>
                 <ContentLabel>Method:</ContentLabel> { p.request.method }
             </CollapsibleSectionSummary>