|
I recently had to make automation tests for something I was not a part of developing, and since I’ve embraced @testing-library hardcore (got offered to help maintain a library about to be included the organization ) the pain of testing something that wasn’t developed with accessibility (and machine readability) is such a pain.Everything is so much easier if you just follow some very simple rules: - use real elements, not divs for everything - if you can’t use a label element wrapping or using the for attribute add an aria-label. An obvious example would be for icons, sure I could look for the element with the fa-Trash class and know I found the delete icon in my test. But how the hell is a screen reader to know that? - sprinkle roles where appropriate, like progressbar These things will be invaluable when writing tests, and means you are 90% or more done with making it accessible imho. And speaking of divs for everything, why do I see it so much from web devs? Is it some misguided attempt at having a CSS reset? And don’t even get me started on using float and clearfix. I find it very ironic that the solution to “never use tables for layout” required clearfix uses display: table; Thank you for coming to my TED talk!
|
#
¿
Nov 14, 2021 08:55
|
|
|
|
| # ¿ May 21, 2024 00:52 |
|
|
Roadie posted:Have fun trying to do a responsive-friendly layout of navbar elements or related article cards while only using "real" elements and no extra divs in there at all. Isin divs is inevitable, it’s using them when a nav, or even a button would be suitable that is pissing me of.
|
|
#
¿
Nov 18, 2021 12:55
|
|
|
Lmao, I’ve contributed to faker.js. When they added currencies they hosed up and for countries that support 2 currencies both got merged into one entry.
|
|
#
¿
Jan 10, 2022 08:48
|
|
|
First if you aren’t using typescript you need to start with that, it will also help you with moving files and stuff. Then the thing that helped me the most with learning how to separate things into proper modules was testing coupled with 90+% code coverage requirements. There is now way you are going to want to make the effort to achieve that without starting to extract units of logic into their own functions or modules. When it comes to testing you should be using testing-library it’s the best! As for more specific advice for how to arrange files I found that some place for generic components like buttons works good, but that then I try to keep all other files arranged more or less by route. But think that type safety and tests are more important for making a project discoverable for new contributors because it allows them to make changes and experiment knowing any gently caress ups will be caught by TS or tests.
|
|
#
¿
May 18, 2022 08:44
|
|
|
I haven’t really touched next that much but the little I have has been very simple. For me it would depend on how you plan on hosting it.
|
|
#
¿
May 29, 2022 22:34
|
|
|
Have you tried writing readable JSX? There is nothing stopping you from changing the levels of your massive ternary into their own components.
|
|
#
¿
Jun 4, 2022 09:02
|
|
|
What fucks my brain up with all the template style frameworks is that it’s javascript (or typescript really) PLUS some weird custom template language thing that’s full of it’s own magic bindings. With React have one thing, and if you hate JSX just don’t use it. That makes thing so much easier to reason about or debug.
|
|
#
¿
Jun 9, 2022 22:53
|
|
|
Answering questions commits you to the possibility of being wrong and getting down voted. I think that is why you see so many answers in the comments and people farming rep from formatting stuff and other low risk activities.
|
|
#
¿
Jun 22, 2022 08:56
|
|
|
React keeps track of which useState is which by knowing which component is being rendered and the order of the hook calls inside of the component.
|
|
#
¿
Aug 7, 2022 14:37
|
|
|
Yeah if they make such a convoluted API they should include a client. But they probably don’t. Reading the whole description made me think state machine, maybe xstate or some other library can help you with the plumbing
|
|
#
¿
Aug 19, 2022 12:03
|
|
|
I don’t remember the exact problem on the top of my head, but I do remember that React does something different with those events and that if using something like playwright you have to apply a small hack to have it behave the way you want. edit: or maybe it was when we used webdriver.io zokie fucked around with this message at 09:05 on Aug 31, 2022 |
|
#
¿
Aug 31, 2022 08:56
|
|
|
There is https://medialab.github.io/iwanthue/ and also https://gka.github.io/chroma.js/ which supports scales like this https://colorbrewer2.org/#type=sequential&scheme=BuGn&n=3
|
|
#
¿
Sep 22, 2022 16:24
|
|
|
Failed to fetch is usually the generic error message you get why you have CORS problems.
|
|
#
¿
Feb 5, 2023 17:46
|
|
|
If typescript is getting in your way when prototyping maybe you are being to explicit. You don’t have to provide a return type for example. And for you parameters you can just describe basic shapes you don’t need full types.
|
|
#
¿
Oct 27, 2023 09:39
|
|
|
If you do a manual fetch, maybe you are sending some headers that need to be controlled? Because otherwise a POST isn’t really supposed to be preflighted. CORS is for reading
|
|
#
¿
Nov 18, 2023 23:46
|
|
|
I mean come on, React is a presentation library. It’s not your state management thing or your routing. So if you think it sucks, then React is not your problem
|
|
#
¿
Apr 9, 2024 20:44
|
|
|
I’m back at work again after paternity leave, and I don’t like some of the things the guy that filled in for me did… The most harmless is probably that we introduced an alternative “view” of the application that isn’t fully featured. A part of this is that all everywhere we used to show the specific string “configuration” we need to show “selection” for all the “easy mode” users. How was this solved? By using ternary (?  expressions at every instance. And I’m like, duuude! We have been dragging around an i18n library for 5 years in this application but only have one language, and now when we need to solve what is basically a parallel of internationalisation and internationalization you don’t think to use it?Also we’ve had a standard of PascalCase for folders and camelCase for files, but now for new files he has been using kebab-case (a few things have also been renamed). Who does that? Like I don’t care about which you use, but you have to be consistent! If they had changed it over the whole solution I would be happier, no god damned half measures. If the reason for a change is good, then you complete it over the whole solution. Of that is to much work or whatever your reason to change is to weak
|
|
#
¿
May 11, 2024 08:25
|
|
|
It would be the same for all languages if we ever actually translated. But I doubt we ever will. To me this use case is no different from using different dialects or number systems. It really is just a “dialect” of the application.
|
|
#
¿
May 13, 2024 18:38
|
|
|
Bruegels Fuckbooks posted:because the i18n library shouldn't be giving you different strings based on your application state - you give the library the dev string it gives you the translated string. if you do something like this you're coupling the i18n library with your application state. Are you saying you shouldn’t couple the i18n library to the application state of: the language being used by the user???
|
|
#
¿
May 14, 2024 22:04
|
|
|
|
| # ¿ May 21, 2024 00:52 |
|
|
I actually solved the problem by using two different views before my paternity leave, but the clowns undid that and went with conditional-fest instead. This I also hate, they argue that now changes that are done to both would require less development work completely missing that now changes to one mode would require the testers to test both. And the testers can’t copy-paste their work. The difference between configuration and selection in the application is tiny, a selection is a subset of configuration if that makes sense. A configuration could also be some other things like a rating.
|
|
#
¿
May 16, 2024 06:07
|
|