Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: unexpected scroll behavior after edit on long transcript #247

Open
shea12 opened this issue Oct 2, 2020 · 4 comments · May be fixed by #248
Open

Bug: unexpected scroll behavior after edit on long transcript #247

shea12 opened this issue Oct 2, 2020 · 4 comments · May be fixed by #248
Labels
bug Something isn't working

Comments

@shea12
Copy link
Contributor

shea12 commented Oct 2, 2020

Describe the bug
While editing a long transcript, the transcript will automatically scroll to the bottom of the current block after autosaving.

To Reproduce
Steps to reproduce the behavior:

  1. Begin editing a long transcript (see gif below)
  2. Stop editing, wait for autosave
  3. After autosave completes, the transcript will jump to the end of the edited block

Expected behavior
The transcript should not scroll unexpectedly.

Screenshots
react-transcript-editor-scroll-bug

Desktop

  • OS: macOS
  • Browser: (all) chrome, safari, firefox
  • Version: latest
@shea12 shea12 added the bug Something isn't working label Oct 2, 2020
@mcwhitaker
Copy link

This happens on Windows machines as well, latest version.

@jamesdools
Copy link
Contributor

Hey @shea12 & @mcwhitaker!

Sorry we didn’t see that issue - it's been a long while since we've touched RTE and have been on other projects (but we’re really trying to carve some time out in the future for it).

@mcwhitaker mentioned you were keen to explore a fix yourself in the meantime - more than welcome to!

The code is very messy and hacky for sure so I imagine it'd be a real struggle haha. Lots of React things have moved on since we prototyped this (we are a Lab after all!)

We're aware of a few bugs to do with focus / cursor position and they are definitely the most jarring and experience-impeding parts to editing a transcript. This is handled in Draft.js by the SelectionState (Draft docs link). If you've not dealt with Draft.js before, I gave a quick overview in a talk a while back that may or may not be helpful!

Once you start typing in the editor, all things come through this entry point here in the TimedTextEditor component.

Most of these bugs tend to happen once we autosave and attempt to re-align timecodes we have (in lines 96-97). It kicks off quite a few bulky operations but that's where to start I think.

We were thinking of reducing / turning off the autosave at some point as it does tend to cause problems.

Hope that helps if you were keen to dig into it but no worries as it is a headache!

On a sidenote though - would be great to know more about your transcription use case - and might be useful if we ever get round to a V2!

@mcwhitaker
Copy link

Thanks, @jamesdools, for the pointers! We will try to resolve this issue and submit a PR if we succeed.

@mcwhitaker
Copy link

@jamesdools - As for our use case, we are using your transcript editor in the context of the Audiovisual Metadata Platform (AMP) project. We are piloting the idea of using AI tools for metadata generation for large collections of A/V materials. Machine-learning and AI tools are added to a workflow, the output of one potentially used as the input of the next tool in the flow. One of the categories of AI tools we are using is STT and the BBC Transcript Editor is used to correct the machine-generated transcripts. Corrected transcripts yield better results than uncorrected ones, for instance, when used as input to NLP tools.

@shea12 shea12 linked a pull request Oct 23, 2020 that will close this issue
@emettely emettely linked a pull request Oct 29, 2020 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants