Comments (12)
Apologize for this bug, I will prioritize fixing this issue early this week
from open-resume.
Please don't apologize, we appreciate your work and your time.
from open-resume.
Feels like there is some kind of counter issue? You can eventually get the text (full phrase) fit for the one bullet if you play around enough with spaces and backspace.
from open-resume.
Can confirm this happens on Safafi Version 16.5 (18615.2.9.11.4) as well.
from open-resume.
I am facing this issue as well. I just checked right now.
Just adding a space enters a new line, and then from then on, every keystroke creates a new line (or a new entry in the bullet list).
from open-resume.
Just got a chance to take a closer look at the issue. BulletListTextarea is the component to manage the descriptions input. It is essentially a content editable div and uses innerText
to set what user enters. A weird thing about Firefox is that if it is at the end of the line and user presses space, innerText
appends a new line character instead of appending a space as in other browser (Chrome, Edge).
It is not as a simple fix as I would have previously thought. I just created an issue with Firefox on webcompat/web-bugs#124217 to learn more about why innerText
behaves such a way 🤔
To reproduce this issue:
- Visit the codesandbox debug setup created https://codesandbox.io/s/contenteditable-innertext-debug-kf5psc?file=/src/index.js
- Open Console in codesandox
- Enter b in the textbox, observe it prints "ab"
- Enter space in the textbox, observe it prints "ab" follow by a new line (in Firefox) instead of "ab " (in Chrome, Edge)
from open-resume.
Seems to work fine now on Firefox and Safari . Thank you .
from open-resume.
Hey great tool. Can confirm I also have this issue on Firefox Desktop 114.0.2 (64-bit)
from open-resume.
Up!
In bullet point sections, after the first word and a space, every letter goes to a new bullet point:
It's fine in Chrome though.
from open-resume.
What happens using innerHTML?
from open-resume.
Thanks all for reporting this issue! I just created and released a fallback component BulletListTextareaFallback
for Firefox and Safari as a workaround solution. Can anyone help test it on their end and confirm if it indeed solves the issue?
The fallback component should work fine most of the case. There is a small edgecase I notice where it would refocus to the end if you have say 2 bullet points, and you try to backspace/remove the second bullet point to combine it with the first one. Hopefully this isn't common to run into.
I initially created a custom BulletListTextarea
component since I want the output to be an array of string type descriptions: sting []
given that is the input format consumed by the react pdf render to render the description list. I used innerText
since it would be easier to serialize and deserialize things by splitting the string by new line. Using innerHTML
might require more work to split by <div> <br>
and we might go into the same problem, as I notice Firefox adds a <br>
in innerHTML
if user adds a space at the end of the line.
A lesson learned is that each browser handles innerText
and innerHTML
very differently, and it can be risky to rely on them.
from open-resume.
Thanks @williamtwild for confirming! Closing this issue for now given that the fallback component seems to work fine.
from open-resume.
Related Issues (20)
- Project Links Required HOT 7
- [Feature Request] A scoring system based on parsed data
- Does not support font ligature characters
- Curl call to post a pdf resume
- Add a save option [Feature] HOT 2
- [Feature Request] Indent bullet points
- GPA not applicable in my country
- Workday compability HOT 1
- Allow importing files other than pdf
- [Feature Request] Support more than 1 page resume content rendering HOT 3
- additional featured skills
- Not able to add Image (Avatar) HOT 4
- [FR] Allow for skills to be broken into multiple columns HOT 1
- How to modify it to support normal display of Chinese input on web pages...... HOT 1
- How to run this
- 中文解析完全用不了 HOT 3
- 多页简历
- 如果能上传个人证件照就更好了
- 拉下来的项目创建简历后无法下载pdf是什么情况,下载按钮没用
- Support Markdown in Objective Section
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from open-resume.