diff --git a/src/components/info/index.tsx b/src/components/info/index.tsx index ea38f4a..5677890 100644 --- a/src/components/info/index.tsx +++ b/src/components/info/index.tsx @@ -27,7 +27,7 @@ interface ConnectProps { interface KeyboardA11yProps { handleKeyDown?: () => void; setIsModal?: (isModel: boolean) => void; - addAccessibleChild?: (element: HTMLElement) => void; + addAccessibleChild?: (element: HTMLElement, pushToBeginning?: boolean) => void; } type MergedProps = InfoProps & ConnectProps & KeyboardA11yProps; @@ -47,6 +47,7 @@ const translates = ({plays, creator}: InfoProps) => { @withKeyboardA11y @withText(translates) export class Info extends Component { + private _descriptionDivRed: HTMLDivElement | null = null; renderMediaInfo = () => { const {creator, createdAt, plays, creatorText, playsText} = this.props; @@ -76,6 +77,18 @@ export class Info extends Component { componentDidMount(): void { this.props.setIsModal && this.props.setIsModal(true); + this._addElementsToAccessibleList(); + } + + private _addElementsToAccessibleList(): void { + if (this._descriptionDivRed) { + const linkElements = Array.from(this._descriptionDivRed.querySelectorAll('a')).reverse(); + linkElements.forEach(element => { + if (element.hasAttribute('href')) { + this.props.addAccessibleChild && this.props.addAccessibleChild(element! as HTMLElement, true); + } + }); + } } render(props: MergedProps) { @@ -92,7 +105,12 @@ export class Info extends Component { {this.renderMediaInfo()} {description && ( -
+
(this._descriptionDivRed = node)} + /> )}