This one is all heinous, so it's fine
Streamed
Reverted CSS grid layout changes from PR #1508 due to serious Safari performance issues. Fixed session cookie security settings in #1560 with same-site strict and HTTP-only flags. Battled with Git merge conflicts while reverting the grid layout changes. Added tab index accessibility improvements to comment folders for keyboard navigation. Fixed various visual bugs including comment previews and page padding issues. Closed a whole lot of GitHub CSS issues: #1561, #1563, #1564, #1565, #1566.
scratch
topics
session cookie https://github.com/lobsters/lobsters/pull/1560
:selected https://github.com/lobsters/lobsters/issues/1566
subgrid pr https://github.com/lobsters/lobsters/pull/1555
comment links https://github.com/lobsters/lobsters/issues/1561
comment preview https://github.com/lobsters/lobsters/issues/1563
page padding https://github.com/lobsters/lobsters/issues/1564
editing on ~user/threads https://github.com/lobsters/lobsters/issues/1565
big fix: https://github.com/lobsters/lobsters/commit/b2965a6da73fbdc6785bf56cdb2adc7c7aba8a2d
title
this one is all heinous, so it's fine
post-stream
Transcripts are generated with whisperx, so they mistranscribe basically every username and technical term. They're OK but not great, advice appreciated.
Recording
03:21And this is open office hours.
So if you have any questions about the site or the code base or the community, or I don't know, we can jump in and talk about whatever you like.
pushcx Howdy, drop questions into chat anytime!
So let's see, I'm getting a little scratch file set up off stream here, and then let's throw the message in here.
...53So when folks don't have stuff to talk about, I work on the site. And what that looks like right now is going to be working on some layout fixes for the CSS grid stuff that has unfortunately been a hassle with Safari because of a performance issue in it. And let's see, where are we now? let's take a look at the pull requests i don't think anything came in over the weekend there was this from the last stream and then this pr is what i was gonna pick up and then well this is pretty much why is because i've got a bunch of a bunch more reports about visual stuff over the weekend so On this one, let's take a look at this. I should work on this.
05:01So I'm putting this in the notes. Yes, we've got the session store. I was just looking at this for something else.
...18Key secure and HTTP only. Oh, wouldn't it be useful to describe them? Seriously, if we don't describe them?
...43Let's see if...
...51So I've peeked at the pull request, and this looks correct for me, but I just literally haven't seen any description. And so I just wanted to find some docs.
06:21But if there aren't any, that's unfortunate. Yeah, we're down into someone's notes.
07:09So this is JavaScript can't access it, right? Yeah. Which we don't, right? I know we do this CSRF, but we don't touch the cookie. No. Okay. Since that's what it's doing. I'm going to go ahead and say that part of it is good. The other thing. is the same site strict. And I know there's strict and lax. Cookies were not sent along with cross-site requests. Why would there be a cross-site request? Because the cookie is locked to the domain, regardless of the source of the request. That reads like nonsense.
08:35I'd like to see someone describe what it's supposed to do.
09:05Restricting cross-site contexts. Great. So this is the thing I'm thinking of, but there isn't a definition of what these different things do.
...27So secure, did we turn that on, right? Should turn that on too.
...46can never tell am i allowed Sort these keys.
11:17This is a little frustrating to not have this documented.
...38May not be the greatest at writing docs, but
...48Same side, actually. But what do they do?
12:12Show changes. Why would you send cookies?
...24That's weird.
...38Yeah, that should be strict. All right. Close everybody out. Not you.
13:13this is waiting that's not gonna fail let's wait for the build you know i just saw a talk and he mentioned oh we rebuilt this in rails or in react and i was like yeah i noticed it got flaky a couple months ago i didn't want to be mean but what was that the I want to say the San Francisco Bay Area Ruby groups, they put their recordings online, which is very neat. Looks like it's a huge Ruby user group. All right. So this should finish in just a minute and be fine.
14:27Sorry, got a text. All right, any time now.
...45Guess GitHub is busy. Well, can't really complain when it's free.
15:00And the only other PR is the subgrid one. Yeah. So.
...31in a minute and then i got a couple of issues so i'm literally just watching this yellow dot when it goes green those are ready so let's grab these this one is the one that's driving me up the wall personally And then preview margin padding on mobile. I just mentioned this in another issue.
16:21I want to say on the pull request that we're going to get to.
...51Man, it's still going.
I wonder if we got some kind of a bum work, or if I bounce it.
Let's bounce it.
vinitkme Hello, Hello
Because usually this takes like 45 seconds, even on CI, which is not particularly fast.
You know, if I can't even cancel, I wonder if the worker crashed in some way.
Hey, Vinette.
Welcome back.
Let's just rerun this job.
Just test.
All right, it's rerunning all of them.
17:43I want to jump into this one first. Because it doesn't look related to anything else.
...55All right.
18:24vinitkme Are you running a thinkpad?
No.
No, I'm not using a ThinkPad.
I haven't had one for a while.
This is a home-built desktop that I'm on.
Why do you ask ThinkPad?
19:08vinitkme Linux folks prefer Thinkpad. I assumed you had one too
You know, I used to have a ThinkPad.
It's been a few years.
Yeah.
I ran Linux on an Apple laptop for a while just because there was a couple years where that was by far the nicest hardware.
Maybe early, mid-teens, early teens.
And then switched over to a ThinkPad somewhere in there.
Maybe 20...
15, 16.
Yeah.
20:03I want to expand or collapse button. Let's start with, you know what, let's go ahead and log out. This doesn't require. Okay, so I can toggle that. Oh, it is skipped. All right, let's go find it. It'll be a single detail.
...49But the same bug will probably be in loose detail. So we'll take a look. All right, let's take a look at
21:54Okay. Yeah, all right. So I don't know if we're firing a click event or what. Do we have a JavaScript console error? It doesn't look like it.
22:26All right. Which, since it appears with the checkbox hack, I would really have expected that to work with the label highlighted.
...48Let's go ahead and make this visible. I don't need to tap through the console. Yeah. It works by the mouse, but not
23:28What is this shit? Just let me see the post. So if we have the tag box.
...44So it's four. I wonder if somehow I've gotten the four should match the ID. That sure looks like the same line of code.
24:17So we've got the input with the name of the story ID and the label for it.
...28If we click target, the browser knows it's targeting. It works when clicked. But the tab index doesn't. Huh. Space is... Oh, do I need to accurately convey that the label controls the checkbox?
25:25So I can toggle it with space. What if I say.
...46OK, so this looks like a browser issue that. I can't use a label to toggle with the keyboard.
26:14Oh good, the slop says I can.
27:00Now see, this doesn't seem to work, because even when I made that visible, I can select the checkbox when it's there, but not by the label.
...43And this is all going to be things that don't include toggling based on the label.
28:13I wonder if this nested version would work. I saw that mentioned in the... Can I tweak that? No. Yeah, great. Use React. Use JavaScript.
...57Use JavaScript to recreate the control? What?
29:11Rule equals checkbox.
...20So what if we do that?
30:15You did all of it with check.
...40Again, they're just redoing it all with JavaScript, aren't they? Yeah.
...49All right. Aria-dash, let's grab that.
31:29This does need an ID. So let's say a-label, just archive label. That's placeholder, obviously. And then, yeah, no, it's not.
32:31Hmm.
34:34Other thing, let's try the other layout of putting the input in label.
...52I don't know if I'll need the four there, right? So let's try removing that.
35:08that's interesting those are selectable yeah so it knows it's in there there must be oh the css must be yeah it's got to be next to the thing it's supposed to like that's that's fixable but I can see that the checkbox isn't toggling except when the... Yeah, so that doesn't do anything.
36:15You know, I didn't try child with the four. So let's put that back, try one more thing.
...29Yeah.
38:09Oops.
...59Yeah, the comment folders are also using checked, so that's why.
39:42Excuse me one sec.
40:16Just had to take care of something right there. Should solve it as well.
...57I'm going to still, as long as I'm looking at this on master, I'm going to add that tab index equals zero because we should have that. So comment.
41:30This one needs it. This one is where I just added it. Except I don't want to change the layout here. And then See you next. Again, who are you? Stories show. This must be a heinous inline partial. So if I just reload something in dev.
42:23I guess it's not. All right.
...38And these folders, where's their label? Yeah. That should do this one. Yep. This one, yep. And that one, yeah. All right, so let's look at the diff. Oh, I definitely don't want to reveal that.
43:31What's my bug number?
...391566.
44:06So if that's pushed up, these are two pretty promising domains. So that's why I'm peeking again. This is the doc I was just going through, going through.
...38This is a opinion thing about design.
45:12Yeah, which natively provides all the functionality required, except it doesn't.
...38Browser passes its focus. including touch screen, but it doesn't say keyboard. Finding an implicit label, right, sure.
46:23Yeah, that doesn't work either.
...44kazaii626 Yeah, I always opt for a thinkpad for my linux laptops.
Does this have an ID so I can just link to it?
...52Ah, hey, Kazai.
Welcome.
kazaii626 hey, Mr. P
Yeah, I think if I got another laptop, it would probably be one of the ThinkPads.
But... Mr. P. Mmm.
47:29aria-label, table menu, aria-hidden, and then more JavaScript.
...47Okay, so a guy says you can't.
...55That would be a shame if that's a permanent limitation of the checkbox hack.
48:31kazaii626 What distro do you use?
I'm using Arch.
I started Linux with Slackware back in the 90s and moved to Ubuntu for a while when I realized I stopped.
I wasn't learning anything anymore.
Because one of the nice things about Slackware is since you do so much stuff manually, you really have to learn how to compile software and understand dependencies and find your way around the system.
And then after a few years of that, I was like, oh, I'm not actually learning anything anymore.
I'm just doing a big chore.
kazaii626 Ah, I see. I missed out on the Slackware days. I started with Linux in 2010. I started with Ubuntu and moved to Arch ..... ~ 10 years ago.
So I switched to Ubuntu for, I don't know, a decade, decade and a half.
And then enough stuff had changed that I realized I was out of touch and I didn't understand how things were working and how they related.
And I was kind of frustrated because I had a hassle fixing stuff.
And then...
I was like, you know, every time I'm looking stuff up, I keep finding the Arch Linux wiki.
So let me try running that.
kazaii626 I use Arch on this desktop, and EndeavourOS on my Laptop (just a batteries included Arch distro).
And I've been running that for, oh, I don't know, maybe 10 years now.
And I like it a bunch.
It's a nice balance of automatic things and do it yourself.
And I'm a terminal guy, so I'm very happy to not have schmancy GUIs for everything.
Ah.
So it sounds like you've got my same experience.
You just chop off the, I don't know, seven or eight years.
Slackware on the front.
Ah, I don't know Endeavor OS.
I actually have a, what is it, a Pine64 laptop laying around that I should throw Arch on.
It has whatever they shipped with by default, but I haven't cracked it in a while.
50:46It's sort of like, because even if I put this checkbox role on the label, I think I still wouldn't get the keyboard handling. And then I couldn't change that. Well, space activates the checkbox. And is that the checkbox role? So we have div role equals checkbox. I guess it's sort of
51:50Oh, I get what's happening. The other element, it's not, it's sort of making, it's what that Reddit comment was saying, is it's making the other element into a checkbox.
52:23so can i no it doesn't have a cute little runner here all right so let's let's go back to single detail so on this if i just got rid of the checkbox and i had a label and it and it wouldn't need a four and i said it had what The role of check box and aria-checked-equal. And it's focusable. So then I would have just a label instead of also. Yeah, I don't think. The keyboard is toggling it, but I can't really see its state. Cause space is scrolling the page instead of, so even with the role and the checked attribute, it's just throwing away the keyboard.
53:57Do I also need
54:38okay so that works but i probably did they bind their own javascript yes they did
55:09They don't really explain their keyboard support.
...41We use the checkbox role or hack in a pretty load-bearing role. I don't want to lose that.
...58Let's see. Everybody's just writing JavaScript.
56:17Oh, good. So it works in edge, but not others.
...40No.
...57This is just going to be JavaScript, isn't it? It's not. OK. But I'm not selecting the labels.
57:35All right, that's a strange one.
...43God, if we can't use the checkbox hack because of accessibility, like the archive dropdown, I can kind of see a way to fix that.
58:04but the comment folders, I don't know. And if screen readers do all run JavaScript, then I guess we can add JavaScript to that, but that would be a shame. Boy, what's happening here? You've been running this test for 40 minutes. Yeah?
...33alex4tmm wow thats a long test :)
Let's try it locally.
...41Let's end that Rails server.
...50So we added secure, true, same, site, strict, and HTTP only.
59:09can't modify frozen or what in the heck what in the hell is this error this seems totally unrelated to what i just edited save the stash Run RSpec. Yeah, OK. So adding, did I typo? No.
...59Save. Yes.
01:00:11So if I add those, the site breaks up in a weird fucking way. What is this hassle?
...26Can't modify. Could you even be loading Turbo?
...44Okay, which one are you mad about? Not that one.
01:01:02OK, wait, so same site breaks it.
...11Same site or HTTP only breaks it. Well, this one may be a formatting thing.
...50Run initializer array on shift. What in the hell is this error? Is this something in the middle of Rails?
01:02:22It's not the so by default the our spec hides lines of the backtrace that are in your gems so I added dash be because I wanted to see where the exception was because it's clear that it's not this line of code right like this is. Nothing this is.
...55Okay, so it's fine with HTTP only. Is it fine with secure true?
01:03:08No. Is it fine with SAM site strict? No.
...38This really looks like a bug in Rails.
...48Initializer. So this line of config environment is saying, hey, boot Rails. And then it goes into Rails, application, initialize. And then while it's sorting, can't modify frozen array. I don't even know.
01:04:16Yeah, we don't use freeze very much. That feels like the only thing that's... Yeah, no change, unrelated.
...52I have no fucking clue.
01:05:12And then I guess it's happening in Rails initialize, right? I feel like this is one of those where I'm going to add I'm trying to focus on, has somebody seen this before? And as soon as I add a exception, all right, this is the same basic shape of it. Always from the first line in the spec, yeah.
...47573 initializers, that's a very patient debugger.
01:06:13You can load.
...22It's Zeitwerk? What on earth? All right, let's try it.
...57That's the exact same error. That's no help.
01:07:20What in the RSpec?
01:08:33know what's frustrating is i pretty sure this gray hatter person doesn't know ruby and so this is probably just going to hang out until the pr closes because i'm trying to get the short version of it so i can show the short version and then come back and show the long and it's already off the scroll back all right then
01:09:07No, no, no. Come here. I see I have fail fast, but it's running them all because I guess it wants error fast. So I'm just going to grab one of these here.
01:10:06This is a pretty frustrating day of coding that two things are running into weird ass bugs. So let's take this, take it down to the environment line, and then grab the rest of it. I could use Vim better to do that, but it's fine.
01:11:16This list of gems like That doesn't appear in our source. That's something from I don't know bundler real ties. Sure, not us.
...49All right. Let's things back. All right.
01:12:20Oh, man. So after jumping into two surprisingly frustrating bugs, none of these are really appealing. I wish I had something easy to work on for a minute to kind of rebuild momentum.
...40Let's see what's new here. Yeah, this is...
...54This is the CSS grid thing.
01:13:12I have too much to say about it. Let's come here.
...27That's not a good first issue, that's a giant thing. All right, let's take a look at the others.
...39Comment isn't rendered. This must be on the, is this the top level? So we have two kinds of comment for, no, okay, so this is, responding inside the comments on an individual story.
01:14:10Yeah, you can see that there's a comment folder. Hmm.
...30I wish ERB was not so unreliable. Like this looks like we're serving up half of the HTML. We have an issue with the comment previewing where when there's deleted comments, we're probably putting out invalid markups. And there isn't a way.
01:15:29i know i saw this did i write it in here yeah yeah
01:16:15All right. Man, all I wanted was for the front end to have a reliable modern markup. And then this is what happens when you want things and you fix things, is they blow up. If we just never changed anything, we would never have any bugs, right?
01:17:11All right, so enough stuff changes that I'm not sure where to start. I think probably by grabbing this stuff around the logo sizing and making a variable void, because we talked through this with . And hmm.
01:18:21So let's take a look.
...36I think what we want is some grid, but not subgrid.
...52How many subgrids do we have?
01:19:20Can I cherry pick in from her commits?
...28I don't think so.
...45All right, well, Chamelis, I don't know if you're here, but I'm going to make some work for you by creating conflicts.
01:20:24You know we're about halfway into the. office hours stream, so I will mention that this is. lobsters office hours.
...46And if you have a question about the CIDR community or codebase, you can throw it in the chat anytime. And then otherwise, you can look over my shoulder as I work on stuff.
01:21:12kazaii626 Do you always do this roughly the same time each month? This is the longest I've been able to join.
kazaii626 oh, twice a week!
Kazael, I do office hours twice a week.
So it's Mondays at 2 o'clock, at 2 in the afternoon on Chicago time, and then Thursdays in the mornings.
Yeah, very busy.
I don't always remember to put the little footer on the site, so if you saw the footer on the site, I think it took me 15 or 20 minutes into this stream to remember to turn it on.
01:22:15kazaii626 Sweet, I'll have to add it to my calendar then.
kazaii626 I'm not a web dev so it's nice to shoulder surf & learn.
Yeah, you get to learn why we web developers day drink as we climb up and down the stack of a giant API.
01:23:05kazaii626 well, I'm a NetEng & work in Network Automation. So I guess we day <insert strong drug here>
Oh, yeah, that one is hard.
So I assume you're mad at DNS and BGP a lot.
kazaii626 Yeah, that's definitely part of it.
That's where I tend to hear stuff.
I was trying to see where...
I merged this, which I think was here.
...51So let's make an experiment branch.
01:24:08So I'm talking a little with Chambliss Offstream, who was the one who did the big layout changes. And she said basically that maybe it's going to be easier to revert all of the grid stuff and then pick back up what we can from it than try to go from where we are now back into a good state. It's such a big set of diffs. All right, so let's
...45So what I need is this.
01:25:00That's the primary thing. I bet I'm going to get a million conflicts.
...15Wait, what is this? OK. Yeah.
...39Oh god, and it's a big conflict.
...53Is this even a ballot conflict? I don't know that I've seen this vertical bars thing before.
01:26:54I thought I had a tool for dealing with conflicts and I sure don't remember what that tool is.
01:27:54Let me see if it was Vim Dev.
01:28:30You are not showing me something useful, though. I really hope for the view where it splits it vertically.
...50So this is on.
01:29:04This whole thing with comment gutter.
...25Got to double check this. I wondered if there was a way.
...46Yeah, I wonder if I want to do no commit so that I get, yeah, more than one to your index in a row.
01:31:42kazaii626 Alrighty, gotta jet. Catch you for the next one
Oh, great.
See you Thursday, then.
Thanks for dropping in.
kazaii626 Cya then!
This is the wild, exciting time of maintaining a website.
...58Let's just name the individual commits, I think, because I don't want to think about that dash m.
01:32:18I honestly don't know if this is going to be more conflicts or fewer. What did I do here?
...32No, that part's fine. That's fewer merge conflicts. I guess by walking back through other things that had fixed up, All right, all right, that's smaller.
...55Let's try, what do we think, user show first?
01:33:35Let's talk about it that way. GV just split. That's the view I'm thinking of. Okay. So what changed?
01:34:09This feels like one of those where something small happened up top, like the profile moved or something, and then it thought the whole damn file was a merge conflict.
01:35:25All right, so it's on label grid now. And we have this section of, all right.
01:36:08chamlis_ hi, how's it going?
remember this class equals d hey chamlus i am fighting with merge conflicts as should be expected right
...42Fighting with the git command line, too, where I'm trying to... What's the... I just want to see the fucking file of this version.
01:37:23Hold on, I swear this tool is so inconsistent.
01:38:22chamlis_ the change I remember happening around there was me forgetting a closing > on that span, which somebody else fixed later
Yeah, there's some tiny indent fix or something that I'm not seeing, but it's caused Git to think there's a giant merge conflict in this file.
It is not fun.
So I'm just kind of picking the other side all the time.
OK.
...58I think you might have reorganized something here because of the floating profile image. And then Git has decided that that means everything is a conflict. This looks fine.
01:39:44Okay, so that's taking in the new routing. That's good. Alright, I think that's it.
01:40:11Yeah. All right. Now for the harder one.
...24So this is the new thing. We can just go ahead and delete this.
...38Why is it repeated? I don't know.
...55We have any more conflicts? Hover. This is the tweaks to the upvoter. So before is the correct thing here. I remember that. Okay. That's not so bad for edits. And I think this parentheses is wrong because Git only checks so many lines for markup, and that's a long media query.
01:41:30Yeah, I think that's all the conflict markers.
...50Let's see how the site looks.
01:42:01Well, that's pretty normal. So is that. Let's log in.
...17That's all fine. Apply. Preview. Oh, that's wrong. I must have missed a commit to revert.
...36Let's see if we can spot what there is. How did comment gutter get in here? I thought that was in the code I deleted. I did the revert, but I bet it didn't, I bet it didn't run heinous inline partial, but it would have when my server booted. Yeah, it did, okay.
01:43:14Chanless was comment gutter your class?
...29chamlis_ yes
I think this must be a commit I forgot to revert then.
I'm still reverting.
Continue.
Oh, OK.
So it's not that I was done rewinding.
It's that I did one.
I got some merge conflicts.
Now there are going to be more.
OK.
01:44:08All right, well, I'll go through them one at a time.
...27What the shit? Why am I seeing raw CSS in my comment form? You are wrong about the conflict here. Unless I committed that.
...54I did not. I don't know where the fuck that's coming from. Theoretically, it is possible to use git to merge changes. Theoretically.
01:45:37This one I just created, huh?
01:46:47So threads probably is just heinous inline partial. Good.
01:47:25I have very, very little confidence that I'm actually going to successfully revert these various conflicts.
01:48:19Okay, so I think on this branch that's all of them reverted. That's not quite right. I grabbed the wrong thing there. Okay, so a little confusion there. So I did something wrong with the upvoters in the folder that duplicated them, but otherwise, that's just about everybody.
01:49:48That's also wrong, but now there's only one of them wrong.
01:50:19So it should just be a link. Better.
01:51:28That's a good comment. Wait. Yeah.
...54This looks like I blew away some of my work.
01:52:18How would you have a? This is.
01:53:38OK, so I've got it as it was.
01:54:10this one. I accidentally reverted this. How do I get it back?
...25Can I just cherry pick it?
01:56:02Is that the only conflict?
...09I think so.
...16So let's continue.
...32Definitely didn't get all the conflict markers. How great that Git is just a pile of text and doesn't know shit about... This is really frustrating that I'm cursing at the tool.
...53This is probably just heinous inline partial biting me in the ass.
01:57:06How is there a diff here?
...14No, it omitted a conflict marker. I feel like I'm missing. So it is very frustrating to me. that Git will happily be like, you know, I told you there were conflicts in this file, and I told you to tell me when you resolved them. You told me you resolved them, but there's still some fucking there. It's that last part that's missing where I get why all of this is just throwing tags into the file, but that in-band signaling that it doesn't have the like, hey, that can't be right. That there isn't some, like, I'm required to pass a flag that's like, no, my markup just really happens to look like a conflict marker.
01:58:14So I think I want this first one, right? No, they're both wrong. Is there a third one? Yeah, I want the third one. Except it has... All right.
...45And that handles this first section. But then the parent tree line is supposed to be inside of that. Then there's a score display always. Did I lose that?
01:59:31It doesn't know about the merge anymore. I can see the conflict, but it can't.
...54So let's get rid of this div. has the score I think I just want this second part third part I want it out dented no I have show tree lines twice I don't know which one is correct
02:01:14Let's see if it's the second one that I want to keep. That's in approximately the right place.
02:02:33So you didn't have a label, and you had the if show tree lines, then you had the if it's not gone, and then you had the parent tree line.
02:03:05Yeah, totally reasonable thing to do. Indent that 100 times.
...21I already put the score display there.
...34Grab that fucking code and I'll re-implement whatever change I made.
02:04:32I think this is approximately where we were. This width is a little wrong, but otherwise it's basically correct.
02:05:01chamlis_ yeah I think that's pretty close
chamlis_ I guess you could diff against the commit prior to the grid stuff?
So if I can get this into here.
...29Well, I can, but there's going to be some unrelated changes because it's finding everything. So even if I just turn this to end, that'll be less.
...59So yeah, added that. Don't recognize that. Oh, good, CSS parse errors. So I've made some kind of bad edit somewhere that's got invalid CSS. So this is a thing I actually did on purpose, was replacing this with the Unicode.
02:06:33That's good. That's what we want to drop. There's that. This I brought onto one line just for readability. OK, minor change. It's fine. This is the change to the up folder. This is, I don't know, I guess that's fine.
02:07:07This. This I got to put back. All right. That's got to be there.
...27Oh, no, it's the.
...36chamlis_ does that css to do with the inline folder need to come back too?
Just want to make sure
See, I'm trying to get rid of those inline folders.
I just want to make sure I'm not accidentally deleting the parent line.
CSS.
I don't think so, because I think the inline folder is this one that shows up in the byline.
I don't think.
Yeah, and I can see this line right now, so it must not be that one.
All right, so routes was a thing I changed.
Fixing this.
Short ID stuff.
chamlis_ ahh right
All right, so this one is all heinous.
So it's fine.
That's the last red bug fix.
02:08:35That's the routes fix. Home index. That looks good.
...51Keybase fix. I remember that bug.
...59Did not. OK, wait. That's an addition. Fine. I thought I would see that on the right only. I was going to say, don't want to lose that link.
02:09:17OK, so single detail has the voter fix. The links I added.
...50This all looks good. Let's see our current state. Okay. So I think this is... at a valid revert.
02:10:16So then, if I can get
the upvoters under the folder in this layout were probably fine for now.
And I'll have to click around, but like this, if I preview, yeah, see, everything looks fine here now.
If I post, it should just appear, yeah.
So if I get this under here, there won't be,
an exciting visual regression of the arrows jumping around and then a bunch of people filing more bugs that the arrows jumped around.
And I can run down all the git issues.
chamlis_ I'll check out that old commit locally and check it looks like this, one sec
And then, yeah, having done it and just reviewed the diff, Chamlus, I think this strategy you just suggested of reverting the comment layouts and then
02:11:28yeah i think let me do this thing with the voters and then i think this pr of yours 1555 we can rescue not rescue but it has the right strategy forward because you have the like this width and i i like this I think that's the right way to do that.
02:12:07So if you then add back that width and start using it on the header, maybe we reintroduce the gutter. Well, maybe I'm going to have to do that for The voters right so let's let's take a look here.
...38yeah so these things are here. What if I just said. That.
02:13:15I just combined them naively. How close do I get? Not very. Okay.
...44chamlis_ I can definitely recover the grid changes for the user settings and profiles - they're entirely independent
Okay.
I think that's worth doing, as long as it doesn't lean on subgrid.
02:14:31chamlis_ I'll need to stare at a diff to figure out what the new PR even does now
chamlis_ thanks for suffering through the revert on my behalf, by the way
It's okay.
I'm the mod.
I'm supposed to suffer.
...38I think... So how are these positioned?
02:15:06So if I left that there instead, let's find the
...38See this color kind of make it a lot brighter. OK. So here's the folder. So if I just move. folder which should be visible whether or not you see tree lines into this. That's sort of like progress.
02:17:25Well, let's just delete it and see where that gets me. And then one of you must be display block, right? It's the float. It's the float. All right, so your comment folder.
...55That came back. Let's get rid of that.
02:18:25Okay, better. They're almost aligned. So where's your margin coming from? There. Okay, so where's upvoter? Here. I'm gonna have to make sure I check mobile as well. okay so now they're in line they just need to be on top of the vertical line the parent folder actually they're down instead of up why are they not next to the byline
02:20:02is the line height here, right? No. So if I said that the
...55So now the only thing missing is that these need to be on top, right?
02:21:22Yeah, so that this line appears in the right place. Can I tweak that color here so I can see it as well?
...42No, not here.
02:22:03So it's just a div inside the gutter in this one.
...17So if I change this... Oh, I had two of them? That's not going to be right.
...36That's more right.
02:23:09Can I grab the lex here?
...47chamlis_ bear in mind much of how the gutter currently works is contingent on subgrid so it spans the whole subtree
It's just gone missing.
...54Ah, OK. Then we'll have to put that back.
02:25:06chamlis_ was the reason why there were parent and sibling tree lines before that joined up?
chamlis_ that they*
probably the lines were hard to keep correct maybe they were the thing that i was thinking was a little flaky around the around the comments
02:26:27So almost correct.
...41I got to get something with more comments. Let's try this guy.
02:27:14I think I've been editing the wrong thing and I should have just deleted it. This orange guy is... Orange should have been on top of that. No, they don't need a line to their children.
02:28:07Yeah, this one is to the right then. Do you have a border on you? Where is that line coming from? Here.
02:29:25Why doesn't this one go all the way down like it should?
...59Okay. is the issue that this internal comment, this second one, is missing it as well.
02:30:26I pulled up the source for comment sibling tree line. There is the end of a heinous inline partial. And then if you edit this, update the incredibly brittle CSS selector, comment subtree, comment parent line, or refactor the whole parent sibling line implementation.
...55So why don't I
chamlis_ 😟
Why don't I see this one?
Is it present in the markup?
Yes, it is.
But the last child didn't get one.
So there it is.
That's the brittle thing.
All right, so what did I... What else did I change?
Sibling.
02:31:27So instead of left, it's minus what? So about 1.5 m. And the top was 0. Oh, yeah. Let's change the color so I can see the damn thing.
02:32:04And then, so this whole last child. Yeah, last child doesn't have siblings. Am I thinking of the parent line? Yeah, so this one doesn't have one, which is correct. This does have one and it shouldn't.
...57I almost feel like an extra line or two. is acceptable to get back to a place where we can actually see what's happening and things are mostly rendered correctly. So like this is wrong. This one should run this full height, but doesn't because it's inside there all right hold on let's take a peek this is a whole bunch of fixes just wanted to get that added to the working copy so if i put that back to transparent and then this one the comment parent one It's not in the voters.
02:34:24Let's put it outside.
...34Didn't say it correctly. Reload. Yeah, so these don't have the extras in here. But this one should run the full height, and it doesn't. Why not? Come here.
02:35:13It's next to the comment. Did I change that to relative? Whoa, didn't like that, huh? Oh, that's comment, not the line. Undo.
02:37:25So I'm trying to think if the comment parent line was up here, would it be the right height? If it was outside of the comment?
...49Yes.
...55Then. Instead of being transparent. If this was.
02:38:24Then it would be like black on top? No.
...58Are you coming from?
02:39:48Thank you.
02:40:44All right, I'm going to give it my orange and green and see how it looks. It's extra lines, but it's basically correct. And I think I'm going to take basically correct for now.
02:41:12See, all of these are in the right places. Folders work. Folder disappeared. Why did the folder disappear?
02:42:24Here's my comment folder. As funny as it is to say that you cannot unfold comments, it's not what I want.
02:43:25So there's a folder. There's a comment button. Then we're into the comment class and inside it's got a folder and the voters.
...54chamlis_ oh it's doing visibility:hidden on div.voters
So it's this something in this selector is broken.
If the.
Ah, yeah.
02:44:19OK, so, yeah, it shouldn't be that it should just be on. the score section of that.
...31All right.
Here we go.
Be a little more semantic.
You got it, Chambliss.
chamlis_ 🎉
chamlis_ much as I'd like to take all the credit for this...
spotted the bug you are a channel vip again all right all right so let's so i also say that because i'm reverting a bunch of your work and i don't want you to feel bad or too frustrated about it this is
That performance bug with subgrid was pretty painful, but I don't want you to feel like your time was wasted because we have made significant improvements to the layout here.
There is more to do.
There's always more to do, but nothing bad has happened.
02:46:00So let's look at mobile view. Mobile view looks fine, right? I think, is it? Yeah. Okay, so mobile view loses the vertical lines, which are more useful on mobile.
...34All right, there you go.
...45Screen, max width. So it's present.
02:47:12That's what got rid of it.
...19So line 1567. Let's see that.
...34We just make them always invisible on mobile? I don't understand that. That's got to be some kind of, I grabbed the wrong side of a diff.
02:48:19Would you stop inspecting? Thank you.
...36OK, so you.
02:49:08That's the one I want to fix. You are.
...42This indent is too wide on the wall. That's what's going on.
02:50:13better okay
...451677.
02:51:25OK, that's almost there. Let me turn that down just two more.
...36Four more.
...42Here we go. Just trying to make better use of space on mobile. And then where was that transparent that I got rid of?
02:52:101567. Yeah, I don't know what this was supposed to be doing.
...57There's no folders. That's what's going on. All the comment folders are missing. That's why this thing is so far down. There we go.
02:53:17Okay. So we've got some extra lines. Who are you?
...30You are a sibling tree line. There's a magic number.
...58Just hide that one.
02:54:22Okay, there's mobile. All right, let's look at the open bugs.
...43Comment previews, I fixed that. format broken when editing on username threads. Okay.
...58It's probably not a separate bug, but let's leave a post.
02:55:18chamlis_ here comes the satisfying bit
chamlis_ yeah
satisfying bit of figuring out which ones are fixed so that's this one is fine pages are missing margin and padding well these have it and i believe story submit was the one i noticed that's back so i'm gonna say that's fine all right
I wish I had my tree style tabs.
Comment previews.
That's fixed.
Linking to a comment by ID.
That's fixed.
Edit comment page looks weird.
That's fixed.
Comment width gets narrower with each reply.
That is also fixed.
Chat count indicator overflows to next line.
I will look at the homepage, but I'm going to guess that that's fixed, even if I don't have the right browser to test it.
Yeah.
Kind of a lot of space on the right.
02:57:01So inside has the right padding. Stories list has additional padding or additional margin that it doesn't need.
...19Top right, this is the one it doesn't need. The line is this, 1554. OK, that looks fine.
...50Honestly, we could probably do the. Yeah.
02:58:03Why are these breaking here?
...44You don't have a max width.
02:59:01You don't have a margin. Okay, it's just funny line breaks in these examples then. It just looked like there was too much space. right yeah just chance of the particular words that's fine then all right so there's comment balloons snippets as redacted oh that's the text thing threads view has weird formatting
...44OK. Comment anchors. Did we have a dupe of this?
...55Yes. OK. So this one is a dupe of this.
03:00:22You know what?
He took the time to write it.
I don't need to explain to him that it was a dupe.
chamlis_ the thread weird formatting probably has that symptom fixed but not the underlying issue
Nobody likes hearing that their bug was a dupe, right?
...35The symptom of... Alright, so this one is fixed if we're not using subgrid. And... There are no more... There are no more mentions of subgrid. Upfoot button is small. This one... It has this fix from 642. Yeah, so the tap target is that big, which seems fine if I go into the comments.
03:01:37That also seems fine. It could use a little bit of vertical spacing, but I kind of don't want to get into the weeds. Oh, they have a margin? Yeah, well, we don't need that. 1572.
03:02:13Good. Let them breathe a little. Alignment seems to be bugged. And change to center. Well, I don't have mobile Safari, but this is the bubbles again. Yeah. All right. And then this is the... Threads view, there was a deleted comment and things got weird, right? So previewing, I fixed this. This looks fine. Oh, but I'm logged in as a moderator, so I can see the whole comment. Or maybe it's unrelated and it's a nearby comment. Either way, I'm not going to see the exact same thing. So let's do that and then back up to the comment.
03:03:35This is fine. Let's, come here. Oh my God, browser. Grab this and validate it.
03:04:03chamlis_ the bug is only on /threads because the deleted comment is excluded from the thread altogether
Oh, is that right?
...27So I've got to get back to 28 days ago.
...58chamlis_ but without the grid the issue is #1524 which is much less obnoxious
The issue is 1524.
OK, then I'm going to.
Leave it.
Oh, no, there we go.
It is visible.
Oh, I'm on prod.
So if I go back to localhost.
03:05:48Yeah. All right, so maybe 1524. Okay. That's this one that I just double checked.
03:06:10All right. I'm trying to remember the, do I have to say fix twice? You can use a comma separated list. OK.
03:07:06Let me make sure I edit the message. And it didn't let me edit the message. Thanks Git. Can I amend that? What did it do? Wait, why are all of these Origin Master... Was I not on the branch when I wrote all of those? I really do want these to all appear to be on a branch.
03:08:04chamlis_ did it parse -e as a reference somehow?
Yeah, I don't know what it did.
Right like rebase the top thing alright so let's just make the merge commit and then edit the commit.
...23Here we go alright so.
...58All right, what's your channel list? Do you remember your PR number? It's in the log, right?
03:09:22chamlis_ #1508 for the original
1508.
...29Thank you, yes. Primarily reverts 1508, which dated the page to use CSS grid and hit a serious performance in Safari.
03:10:17They have it in the.
...54bim if you give me that warning and i say edit anyways do you think i want to edit anyways or get a blank file how about open read only oh my god bim i just want the class name
03:12:07really said what I wanted.
...38Say different tell a story when in doubt explain things in chronological order.
03:13:47Thank you.
03:14:16All right, Chambliss, here's the fun part.
chamlis_ hang on let me get them open
So this fix is... Wow, where is my... All right.
Here's a clever thing happening with my window layout.
Hold on.
Here we go.
Now let's see what the hell I'm doing.
Let you get what open?
chamlis_ I want to watch them all close live lol
I've got all the comments open, so I'm going to, 1565, 1564.
Oh, you want to watch them all close live?
Will the icon in the top change?
1563.
Which one is this?
1561.
1558.
03:15:42Matt the past my usual three hour mark and i'm starting to get tired it's another reason to leave the comment lines alone, as I was just going to start making mistakes D three. 1544. All right.
03:16:101543, 1535, especially 1532. I don't think I'm allowed to say, oh, I can't put it at the start of a line.
...40And then that's my demo. All right, that's all of them.
...56chamlis_ I'm ready!
All right, Chandler, so you got your tabs all queued up.
03:17:09You should record your own screen grab of them all changing because i'm not going to have any visibility here i'll just have this one which was the bad one that caused all the other hassles all right anything else to say in this message
...51I don't need to whine about how I dealt with a bunch of merge conflicts. Nobody needs to read that.
03:18:34Alright. Why am I still in a merging state?
03:19:01Did I accidentally do all that in some kind of sub-terminal? What's my current state? All right. So this has my big commit message that I just wrote, right? Yes. Good. All right. And then we can drop these probably. But they're irrelevant. They're not going to get pushed. OK. All right, Chambliss. Three, two, one.
...41Hey.
...48Well, did I not type this one right?
Oh, they're not all closing.
GitHub, womp womp.
chamlis_ booo!
I believed you stack over.
All right.
Well, I was going to write a message to folks anyways.
03:20:25No.
03:21:09I don't need to explain bugs.
...52wait this isn't the one okay no this is the bug I think I closed the issue what was it 15 42 24. I just don't want to accidentally close that one all right yeah
03:22:22Have I just been clicking comment and not close with comment?
Oh, I gotta go back and do it again, don't I?
chamlis_ encore! encore!
I'll go back through them all.
...55chamlis_ you hit reopen on that last one
Did I?
03:23:01Nine remaining items, GitHub, all right. Close, not reopen, just close. This one. Comment, all right. Let's go look at the issue list. So this one should have been closed. This one, this one. This one, this one, this one. OK. Feels good to close these. How about I deploy, right? Let's get a deploy going.
03:24:10All right, so now all that, thanks cat. Now was the cat startling himself by knocking my phone on the floor.
...30All right. All right, so.
03:25:28chamlis_ hehe now my github emails are coming in
Now you get hubby meals.
Yeah.
03:26:10I don't know. What do I want to say here?
...40I don't even know why anymore. Gosh, I'm frazzled.
03:27:24So I hope that makes sense what i'm basically saying is you know I don't want to close and throw your work away, I still look forward to future commits from you, and if you want to do them, I would love to have them.
...44let's let's grab this. written show notes.
03:28:00chamlis_ thanks, and thanks for pushing through all the revert stuff
Okay, I think.
...08Okay.
Yeah, I think that's, that's probably plenty.
Well, I mean, you're welcome for pushing through the reverse stuff, but like, I had to fix the site, right?
That's just what the chore was.
So,
yeah let's talk next steps for the end of the stream i think next is you can take a look at your branch in 1555 which is the one i just commented on and grab whatever you think is useful or i know you sometimes like to force push to pull requests honestly i am so happy to have contributions that however you would like to organize your work
chamlis_ patches on a postcard
I look forward to what else you want to add to the site.
Yeah, it would be good to get back the comment form and the profile stuff.
And I guess the only thing I have to say about how I would like to see it is
Patches on a postcard?
Yeah.
I think you're saying what I was about to say, which is it would be great to see very small focused PRs.
chamlis_ right, now there's not firefighting comment stuff, actually doing the form grids will be much smaller
Like one for the submit story form, one for other forms, one for the user profile.
Because then we'll have a little more self-contained work.
Yeah.
I didn't accidentally revert my
at the top of the style sheet, did I?
Good.
03:30:13Okay.
...19Yeah, so I'm still enthusiastic for your changes and we will see if we can get a story form that doesn't break the moment I look at it twice. That one, it's worth mentioning. I mean, you must have seen it, right? That there's the story edit form, which is separate from the story submit form, which is separate from, I think, put it over in mods. stories yeah the the mod view of editing a form and then i don't know what is it yeah the suggestions form so like that's broken up into four different forms and it's not redundant for funsies that's because having all of that wired together through one form and the controller made it impossible to change anything without breaking a whole bunch of stuff. So not just layout, but yeah. Alrighty.
03:31:54Well, This has been Lobster's office hours. I have been Peter, used to be, but still am. And the next scheduled office hours is Thursday morning, Chicago time anyways. Let's turn off the banner on broad. Did I lose a terminal? Yeah. All right. Yep. This has been the end of Office Hours. Hope you tune in again on Thursday. Always happy to take questions about the site and the code base. And hopefully close more bugs than I open, as usual. Take care, everybody. And thank you again, Shamless.