mirror of
https://github.com/hedgedoc/hedgedoc.git
synced 2025-05-13 22:54:42 -04:00
Add e2e tests for diagrams and embeddings (#1025)
This commit is contained in:
parent
c2664b68f0
commit
f9809a4edf
9 changed files with 187 additions and 14 deletions
|
@ -57,6 +57,6 @@ export const FlowChart: React.FC<FlowChartProps> = ({ code }) => {
|
|||
<Trans i18nKey={ 'renderer.flowchart.invalidSyntax' }/>
|
||||
</Alert>)
|
||||
} else {
|
||||
return <div ref={ diagramRef } className={ 'text-center' }/>
|
||||
return <div ref={ diagramRef } data-cy={ 'flowchart' } className={ 'text-center' }/>
|
||||
}
|
||||
}
|
||||
|
|
|
@ -66,6 +66,7 @@ export const GistFrame: React.FC<GistFrameProps> = ({ id }) => {
|
|||
return (
|
||||
<iframe
|
||||
sandbox="allow-scripts allow-top-navigation-by-user-activation allow-popups"
|
||||
data-cy={ 'gh-gist' }
|
||||
width='100%'
|
||||
height={ `${ frameHeight }px` }
|
||||
frameBorder='0'
|
||||
|
|
|
@ -55,12 +55,14 @@ export const GraphvizFrame: React.FC<GraphvizFrameProps> = ({ code }) => {
|
|||
})
|
||||
}, [code, error, showError])
|
||||
|
||||
return <Fragment>
|
||||
<ShowIf condition={ !!error }>
|
||||
<Alert variant={ 'warning' }>{ error }</Alert>
|
||||
</ShowIf>
|
||||
<div className={ 'text-center overflow-x-auto' } ref={ container }/>
|
||||
</Fragment>
|
||||
return (
|
||||
<Fragment>
|
||||
<ShowIf condition={ !!error }>
|
||||
<Alert variant={ 'warning' }>{ error }</Alert>
|
||||
</ShowIf>
|
||||
<div className={ 'text-center overflow-x-auto' } data-cy={ 'graphviz' } ref={ container }/>
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
export default GraphvizFrame
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import React, { Fragment, useEffect, useRef, useState } from 'react'
|
||||
import React, { useEffect, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { LockButton } from '../../../common/lock-button/lock-button'
|
||||
import '../../utils/button-inside.scss'
|
||||
|
@ -64,12 +64,12 @@ export const MarkmapFrame: React.FC<MarkmapFrameProps> = ({ code }) => {
|
|||
}, [code])
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<div data-cy={ 'markmap' }>
|
||||
<div className={ 'text-center' } ref={ diagramContainer }/>
|
||||
<div className={ 'text-right button-inside' }>
|
||||
<LockButton locked={ disablePanAndZoom } onLockedChanged={ (newState => setDisablePanAndZoom(newState)) }
|
||||
title={ disablePanAndZoom ? t('renderer.markmap.locked') : t('renderer.markmap.unlocked') }/>
|
||||
</div>
|
||||
</Fragment>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -15,9 +15,9 @@ export const YouTubeFrame: React.FC<YouTubeFrameProps> = ({ id }) => {
|
|||
return (
|
||||
<OneClickEmbedding containerClassName={ 'embed-responsive embed-responsive-16by9' }
|
||||
previewContainerClassName={ 'embed-responsive-item' } hoverIcon={ 'youtube-play' }
|
||||
loadingImageUrl={ `//i.ytimg.com/vi/${ id }/maxresdefault.jpg` }>
|
||||
loadingImageUrl={ `https://i.ytimg.com/vi/${ id }/maxresdefault.jpg` }>
|
||||
<iframe className='embed-responsive-item' title={ `youtube video of ${ id }` }
|
||||
src={ `//www.youtube-nocookie.com/embed/${ id }?autoplay=1` }
|
||||
src={ `https://www.youtube-nocookie.com/embed/${ id }?autoplay=1` }
|
||||
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"/>
|
||||
</OneClickEmbedding>
|
||||
)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue