Cannot click "Run" on a specific stage about wharf-web

[Alexamakans]

Confirmed bug happens in:

• Brave Web Browser, v1.38.111, Ubuntu 20.04

Confirmed does not happen in:

• Mozilla Firefox, Version 99.0 (64-bit), Ubuntu 20.04

[applejag]

Forcing users to click the text is OK. That's the drawback, but that's what I mean that we shouldn't try to force the HTML to have clickable rows, as that's a dreamy unrealistic goal (at least if we want proper native support of right clicks on the links, which we do).

[fredx30]

Got a fix for this as i was running a few test in my local environment. To me the easy solution seemed to use a less invasive approach to solving the onClick event-bubbling. See a sugested solution here #148.

[applejag]

If we must hack around it, then maybe it's time to stop trying to have clickable table rows. It's not meant to work like that in HTML anyway. It was the designer's dream, but that feature has been troublesome throughout the entire lifetime of this repo.

Suggest we instead just have a dedicated <a> tag for opening the project details in the last column. Same for build details table and everywhere else we have this.

Better to let the browser's native click bubbling and anchor tag features be used instead. It's super annoying that you cannot right click or ctrl click the links.

[applejag]

Couldn't find it before, but yeah I do have an issue on this already: #102

2 birds with 1 stone?

[fredx30]

It seems like a bit of a separate issue. This issue focuses on missing functionality while the other seems to be a code technical one mixing the two concerns seems to me like it would just create a mess.

With regards to #102 im not particularly fond of the sugested solution or the existing solution. I do however agree that the abuse of the onclick is a problem. The <a> tag dose not seem like a very 'angular' solution. I belive a way forward exsists such that the merits of the ngprime framework can be used without writing code that fights the framework. if that were not true i belive the issue should rather be that we should drop the ngprime framework which is just a whole other mega-milestone if thats the way forward.
Perhaps thats a discussion for the forum on #102 though?

Ill fixup the linked PR and open it for review i caught a few bugs there already.

[applejag]

It seems like a bit of a separate issue. This issue focuses on missing functionality while the other seems to be a code technical one mixing the two concerns seems to me like it would just create a mess.

I see it as a proposed solution to this issue. This issue is a bug report, something isn't working. To solve it, we could remove the clickable-table-rows hacks and just resort back to a basic <a> tag instead as proposed by #102.

/.../ The <a> tag dose not seem like a very 'angular' solution. /.../

The <a> tag is a very "every-web-framework-out-there" solution. Then how it routes is up to the framework.

For Angular and PrimeNG together, we would have something like this:

<a pButton [routerLink]="['/project', projectId]">Open &gt;</a>

[fredx30]

I think i see now...
I was still thinking in terms of the click on the entire table row. If we moved the click reference in to the table row items the event bubbling would be 'working as expected'.

Here is a more clear illustration of what would be clickable for navigation in that case.

Whereas before the event triggered off this area

[fredx30]

Unless im missing something here though the emphasiss on the tag is soley for the inherited css -> blue, on hover highlight right?

[fredx30]

My version generates a look something like the following now. The blue color is overridden by some part on the themeing but the link underline shows when hovered anywhere within the table cell.

[applejag]

Yea exactly. I'm actually thinking just adding a button next to the other actions at the far right. Making the project name clickable as well kind of makes sense though.

[fredx30]

This would be the effect using a tag ->

Could be an option as well, however the click has to be on the text in this case as i believe we still need the wrapping <td>

[fredx30]

This f69fb5b is perhaps the best yet transition between the two. Its a bit of code dupe but it kinda works with the previous ui choice.