fix(web): name dsl upload browse actions

This commit is contained in:
yyh
2026-05-10 23:06:41 +08:00
parent 48ce1b60cb
commit 8b4ea63574
5 changed files with 19 additions and 9 deletions

View File

@ -157,7 +157,7 @@ describe('Uploader', () => {
const hiddenInput = getHiddenInput()
const clickSpy = vi.spyOn(hiddenInput, 'click')
fireEvent.click(screen.getByText('dslUploader.browse'))
fireEvent.click(screen.getByRole('button', { name: 'dslUploader.browse' }))
expect(clickSpy).toHaveBeenCalled()

View File

@ -112,7 +112,13 @@ const Uploader: FC<Props> = ({
<RiUploadCloud2Line className="h-6 w-6 text-text-tertiary" />
<div className="text-text-tertiary">
{t('dslUploader.button', { ns: 'app' })}
<span className="cursor-pointer pl-1 text-text-accent" onClick={selectHandle}>{t('dslUploader.browse', { ns: 'app' })}</span>
<button
type="button"
className="inline cursor-pointer border-none bg-transparent p-0 pl-1 text-left text-text-accent focus-visible:ring-1 focus-visible:ring-components-input-border-active focus-visible:outline-hidden"
onClick={selectHandle}
>
{t('dslUploader.browse', { ns: 'app' })}
</button>
</div>
</div>
{dragging && <div ref={dragRef} className="absolute top-0 left-0 h-full w-full" />}

View File

@ -1352,7 +1352,7 @@ describe('Uploader', () => {
)
expect(screen.getByText('app.dslUploader.button'))!.toBeInTheDocument()
expect(screen.getByText('app.dslUploader.browse'))!.toBeInTheDocument()
expect(screen.getByRole('button', { name: 'app.dslUploader.browse' }))!.toBeInTheDocument()
})
it('should render file info when file is selected', () => {
@ -1436,7 +1436,7 @@ describe('Uploader', () => {
/>,
)
const browseLink = screen.getByText('app.dslUploader.browse')
const browseLink = screen.getByRole('button', { name: 'app.dslUploader.browse' })
const fileInput = document.querySelector('input[type="file"]') as HTMLInputElement
// Mock click on input
@ -1659,7 +1659,7 @@ describe('Uploader', () => {
// After click, oncancel should be set
})
const browseLink = screen.getByText('app.dslUploader.browse')
const browseLink = screen.getByRole('button', { name: 'app.dslUploader.browse' })
fireEvent.click(browseLink)
// selectHandle should have triggered click on input

View File

@ -50,7 +50,7 @@ describe('Uploader', () => {
it('should render browse link when no file', () => {
render(<Uploader {...defaultProps} />)
expect(screen.getByText(/dslUploader\.browse/i)).toBeInTheDocument()
expect(screen.getByRole('button', { name: /dslUploader\.browse/i })).toBeInTheDocument()
})
it('should render upload icon when no file', () => {
@ -108,7 +108,7 @@ describe('Uploader', () => {
const input = document.getElementById('fileUploader') as HTMLInputElement
const clickSpy = vi.spyOn(input, 'click')
const browseLink = screen.getByText(/dslUploader\.browse/i)
const browseLink = screen.getByRole('button', { name: /dslUploader\.browse/i })
fireEvent.click(browseLink)
expect(clickSpy).toHaveBeenCalled()

View File

@ -90,9 +90,13 @@ const Uploader: FC<Props> = ({ file, updateFile, className }) => {
<RiUploadCloud2Line className="h-6 w-6 text-text-tertiary" />
<div className="text-text-tertiary">
{t('dslUploader.button', { ns: 'app' })}
<span className="cursor-pointer pl-1 text-text-accent" onClick={selectHandle}>
<button
type="button"
className="inline cursor-pointer border-none bg-transparent p-0 pl-1 text-left text-text-accent focus-visible:ring-1 focus-visible:ring-components-input-border-active focus-visible:outline-hidden"
onClick={selectHandle}
>
{t('dslUploader.browse', { ns: 'app' })}
</span>
</button>
</div>
</div>
{dragging && <div ref={dragRef} className="absolute top-0 left-0 h-full w-full" />}