Project

General

Profile

Actions

Bug #19478

closed

CV Editor Bugs when creating Sample CV

Added by Laurie Hurson 3 months ago. Updated 3 months ago.

Status:
Resolved
Priority name:
Normal
Assignee:
Category name:
CV
Target version:
Start date:
2024-01-03
Due date:
% Done:

0%

Estimated time:
Deployment actions:

Description

Hi All,

I am working on the sample CV and am noticing a few bugs with the CV editor. Sorry I am late to report them but wanted to make sure to flag.

Possible bugs:
1. Name does not appear at the top of the CV Page above pronouns. I tried entering this information in my profile, in case it was pulling from the profile info, but nothing is coming up (maybe it takes some time?). Is the profile information supposed to auto-populate those CV areas? I can confirm this happens in both firefox and chrome after clearing cache.

2. I don't think the "Socials" area is working correctly. I can input information but it appears incorrectly spaced below the word "socials" and I cannot link to any social platforms. Even after I entered a fake Twitter in my profile, nothing is appearing.

3. In "Positions" I can indicate a CUNY campus but the campus name does not appear once the the CV is saved and published.

4. When selecting header media the select area appears to be misaligned.

5. I cannot view, edit, or create a CV in safari. The page does not load.

Other thoughts:
6. Should we add a date input for the positions section? Many people include dates with their CV positions, and if left blank it could just not display.

7. When I am working on my CV but it is not yet published, I have no way to see how it will look once it goes live. So the only way to see how the CV will look is to publish. I do not think this is ideal. Would it be possible to add a "preview live CV" option? This way, people who are working on pulling it together do not have to go live just to see how it will appear once published. Maybe I am missing this option and it is already there, and if so, apologies!


Files

issues 1,2,3.png (332 KB) issues 1,2,3.png Laurie Hurson, 2024-01-03 02:43 PM
Create CV - Safari.mp4 (1.19 MB) Create CV - Safari.mp4 Laurie Hurson, 2024-01-03 02:43 PM
2. social issue -editor view.png (255 KB) 2. social issue -editor view.png Laurie Hurson, 2024-01-03 02:43 PM
4- header media misalignment.png (635 KB) 4- header media misalignment.png Laurie Hurson, 2024-01-03 02:43 PM
Screen Shot 2024-01-07 at 3.19.19 PM.png (204 KB) Screen Shot 2024-01-07 at 3.19.19 PM.png Jeremy Felt, 2024-01-07 06:21 PM
footer-shot.png (54.7 KB) footer-shot.png Colin McDonald, 2024-01-10 02:54 PM
footer-video.mov (8.82 MB) footer-video.mov Colin McDonald, 2024-01-10 02:54 PM
list-view-before.png (20.6 KB) list-view-before.png Raymond Hoh, 2024-01-16 06:09 PM
Actions #1

Updated by Boone Gorges 3 months ago

  • Assignee set to Jeremy Felt
  • Target version set to 2.3.0

Laurie, thanks for sharing these details.

I was able to confirm and address a few of your items:

1. Name does not appear at the top of the CV Page above pronouns. I tried entering this information in my profile, in case it was pulling from the profile info, but nothing is coming up (maybe it takes some time?). Is the profile information supposed to auto-populate those CV areas? I can confirm this happens in both firefox and chrome after clearing cache.

The default value was pulling from a part of the WP profile that isn't usually filled out on the Commons. I've made a switch in https://github.com/cuny-academic-commons/cac/commit/f944abdeec2e0ccac26c01696858282e5b517c8b that should address this.

3. In "Positions" I can indicate a CUNY campus but the campus name does not appear once the the CV is saved and published.

Yes, this was a bug, which should now be fixed by https://github.com/cuny-academic-commons/cac/commit/b62d5b5e9d1cf116315fccb254575be3614e65af

I was not able to reproduce a couple of your items:
2. Looks OK to me, and doesn't match what I see in your screenshot. See https://commons.gc.cuny.edu/members/boonetest401/ on cdev. There are some other problems with the social links, which I'll list below, but the basic functionality seems all right.
4. Alignment looks OK to me. Maybe there's an issue with some cached CSS?

Regarding 5, perhaps Jeremy could look into this with a Mac.

6. Should we add a date input for the positions section? Many people include dates with their CV positions, and if left blank it could just not display.

I like the idea of a "date" field and I think we should talk about how it would work, but it should happen in a separate ticket. Not critical for this release.

7. When I am working on my CV but it is not yet published, I have no way to see how it will look once it goes live. So the only way to see how the CV will look is to publish. I do not think this is ideal. Would it be possible to add a "preview live CV" option?

This is a pretty good idea and I think we should discuss it in a separate ticket for a future release.

A few things I've noticed that I wanted to note here:

8. The icons that appear in the edit view for Socials do not always match the icons that appear on the public view, or the icons that appear in the block toolbar. See socials.gif. The important thing is that they look right on the public view, which they do, but it's a bit confusing to edit right now. Posting here rather than in a separate ticket in the hopes that it's not a difficult fix.

9. Does the WP social-link block allow you to do any client-side validation of user input? For example, if I put 'boone' into the X/Twitter field, the href on the link goes to https://boone.

Actions #2

Updated by Boone Gorges 3 months ago

  • Category name set to CV
Actions #3

Updated by Colin McDonald 3 months ago

Adding Jeremy and Matt as watchers here. I was able to log into this Jane Doe account for the sample CV and add the name, so Boone's bug fix must have helped there.

I'm still seeing alignment issues similar to Laurie's original screenshots on my machine with the cover image across Chrome, Safari and Firefox. I'm doing the best I know how to use incognito windows, clear caches/data, etc. but maybe I'm still messing something up. Laurie mentioned on the community call that she wasn't seeing these issue on her GC computer today.

Maybe my machine is particularly gunked up with old files because of all the testing back and forth, and maybe we can just see how this all looks once we go live. But if there's anyway to purge/reset from the dev side just in case it helps test one more time, that might be helpful/wise.

I'm also not able to get the header image caption to appear anywhere when I updated/save it.

I'm not having the Safari issue with viewing/editing the CVs that Laurie mentioned, but it would be good if Jeremy can double check.

From here, I think the main thing we still want followup on is Jeremy looking at the social block issues mentioned, especially since that block is so prominent.

Actions #4

Updated by Jeremy Felt 3 months ago

Thanks for the testing and all the notes!

2. I don't think the "Socials" area is working correctly. I can input information but it appears incorrectly spaced below the word "socials" and I cannot link to any social platforms. Even after I entered a fake Twitter in my profile, nothing is appearing.

This is working for me, though it sounds like something I have seen before when the focus somehow leaves that social icons group. I've attached a screenshot of what the list view should show. Is there a chance the text/link you've added has ended up outside of the "Social Icons" level?

4. When selecting header media the select area appears to be misaligned.

I can get this to happen on some browser sizes. I'll improve the responsiveness of that layout tomorrow.

5. I cannot view, edit, or create a CV in safari. The page does not load.

This is working for me fine in Safari 17.1.2 on Mac OS 12.7.1 (Monterey). Laurie, if you're still seeing this, can your OS and Safari version? Thanks!

7. When I am working on my CV but it is not yet published, I have no way to see how it will look once it goes live. So the only way to see how the CV will look is to publish. I do not think this is ideal. Would it be possible to add a "preview live CV" option? This way, people who are working on pulling it together do not have to go live just to see how it will appear once published. Maybe I am missing this option and it is already there, and if so, apologies!

As Boone mentioned, I think we can target this in a later release. I'm someone who likes to view the actual preview by clicking a link, though ideally the editor view we've made should be a very close representation and eliminate most of the need for that—especially if all fields are filled in.

8. The icons that appear in the edit view for Socials do not always match the icons that appear on the public view

I have a long blog post brewing for how social links are managed in WordPress. The custom icons we have are already in JavaScript for the block selector view and in PHP for the front-end view. I haven't yet figured out how to get them in the editor view, which is now a hobby project of mine out of frustration. :)

I don't think I'm too far away from figuring it out, but I'd like to not promise it for the release.

9. Does the WP social-link block allow you to do any client-side validation of user input?

There's nothing immediately obvious, but I'll take a look to see if we can add a listener of sorts. We could add some server-side filtering on save or output too.

Actions #5

Updated by Colin McDonald 3 months ago

Adding Laurie as a watcher here to make sure she sees these updates, thanks for doing them over the weekend Jeremy.

Laurie, let us know if Jeremy's guidance on the block levels/sequence with that Social problem helps troubleshoot there, and pass along your Safari version/OS if the CV editor still isn't working for you there.

Jeremy, if you can let us know when you have the alignment/responsiveness of the cover image uploader working better. That way I can make sure the latest version is appearing in my walkthrough video. Were you also going to look at captions? I still can't get them to appear on the front-end when I enter one in.

If it's also doable while you're looking at this uploader, let's change the line that says "Upload a file to use as your CV cover image or select from the commons." to "Upload a file to use as your CV cover image or select a Commons Art Banner."

Actions #6

Updated by Jeremy Felt 3 months ago

Jeremy, if you can let us know when you have the alignment/responsiveness of the cover image uploader working better.

Alignment issues with the cover image uploader should be fixed on CDEV now.

Were you also going to look at captions? I still can't get them to appear on the front-end when I enter one in.

I just pushed an update to fix captions in the edit view. These should now be showing on your public view and in the editor. (Once pushed to CDEV)

"Upload a file to use as your CV cover image or select a Commons Art Banner."

This text has been updated in the cover banner modal.

Remaining:
  • Taking a look at some minor editor layout issues with long content.
  • Fix social icons in the editor view

Boone / Ray - can you please pull the latest to CDEV?

Actions #7

Updated by Boone Gorges 3 months ago

Changes have been pulled.

Actions #8

Updated by Colin McDonald 3 months ago

Thanks, Jeremy! Cover image process/display is looking good to me. The only thing I'm seeing so far is the Commons universal footer being obscured by the editor view, not public view. See attached video/screenshot of Chrome with cache just cleared.

Actions #9

Updated by Colin McDonald 3 months ago

Wanted to bump this if possible, so I can move ahead with the launch walkthrough video. I wouldn't want to make it with the footer position/obscured issue there.

Actions #10

Updated by Raymond Hoh 3 months ago

In https://github.com/cuny-academic-commons/cac/commit/24f7efc427ff3944139a5228f8d0005c5928c1b5, I've just pushed a fix for the footer as well as the following:

  • Ensure cover image stretches across the screen in editor view to match published view
  • Save notice is now stretched across the screen in editor view
  • Better mobile responsiveness for main editor toolbar

This is available for testing on cdev.

Jeremy, feel free to tweak anything that seems out-of-place.

Actions #11

Updated by Colin McDonald 3 months ago

This is looking great to me Ray, thanks so much!

Actions #12

Updated by Jeremy Felt 3 months ago

Thanks, Ray! Things are looking good to me!

Actions #13

Updated by Jeremy Felt 3 months ago

8. The icons that appear in the edit view for Socials do not always match the icons that appear on the public view

I just pushed up a change that fixes this in the editor view by overriding the display of the default anchor SVG with a background image.

I've also removed our X variant, as WordPress includes it in 6.4.

Actions #14

Updated by Raymond Hoh 3 months ago

In Colin's walkthrough video, I noticed a small visual bug when toggling List View mode. See attached screenshot.

This is due to the Gutenberg plugin's CSS. I've just pushed a fix so the List View tabs are styled correctly before the Gutenberg plugin was activated: https://github.com/cuny-academic-commons/cac/commit/539af3fed0c913b9d168efe97a1277b8442babf6 .

Actions #15

Updated by Colin McDonald 3 months ago

Thanks so much, Ray!

Actions #16

Updated by Boone Gorges 3 months ago

  • Status changed from New to Resolved
Actions

Also available in: Atom PDF