DEV Community

bas knippels
bas knippels

Posted on

HTML & Astro bugs.

Hi there,

My company builds machines to make bicycle wheels with. We have things like trueing machines, hub fillers, all kind of machines.

We suffered from legacy and now we have made a new machine using HTML. Sales decided this for us to use HTML. The machine took 5 years to make and I see thousands of hours going into the developemend of the GUI's SPA

We hired a company to design a GUI for us. They gave us a figma design and we were given an HTML project made by Astro and a CSS style sheet. We were only to do JS code and add functionality.

I had no part in the decision making project. I was against the use of this techniques and opted something decents and fast like Qt or anything else that comes with a wysiwyg editor.

And like my coworkers I knew next to nothing of html, css and js. We had to hire a new coworker to help out with this stuff.

I was pulled in the project halfway, I learned Javascript and I got things done. I have noticed all kinds of strange things. Some things are to blame on coworkers and the general lack of knowledge but there are also technical aspects that didnt seem right. And I burned many hours fixing small annoying bugs that I am sure are native to this ecosystem.

The most annoying thing of all is poor reactivity of the touch screen. I have found out that the 'click' event works extremely poor with our windows computer's touch screen. The screen itself is capacitive and works great. It is just that our application worked terribly.

I fixed many issues by using touchstart/touchend events instead of click. This ofcourse lead to coworkers complaining that their mouse no longer worked. So I made a constant for the event types. We on our laptops used click or mousestart, and the target machine used touchstart.

This worked great. This also fixed the poorly working image buttons. We use image buttons for jogging motors. So you would need to press and hold down the buttons to move some motors around. The image buttons were giving us trouble, because you could drag them. This caused initially the motors to keep running after letting go of the buttons. I fixed this with the different event types.

Than I created a new bug. Scrolling on the screen on a jog button, would cause the motor to jog a few pulses. This we fixed by migrating to chromium browser which had a much bigger scroll bar. We can now exclusively use the scroll bar to scroll. So you would not have to accidently touch the jog buttons. IMO a dirty hack and a huge loss that we could no longer swipe the screen no more.

I also managed to kill all radio buttons. It turned out that these would only work with click events. Up to know the reactivity of all radio buttons is poor. It works, but not great.

After the jog buttons were fully debugged. A mechanical boy noticed the color was not correctly. If you would press and hold your finger still, it was fine. If you press and moved your finger a little bit, the button color was not right.

I added javascript code to fix the color of the button. I was spending time fixing some dumb grahpical bug that lies deep into ourframe work. At this point I was sure that this frame work was not well suited for touch screens. All these vague bugs did not seem normal to me.

Than I had to implement functionality for the on screen html keyboard. I was spending time on a keyboard. Manually adding functionality for shift and caps and tab. At this point I felt I was really wasting my time. Doing dumb grunt work that has been done by others like 30.000 times.

And then some human factors.

At my very first day I was already suprised that the main project was in our htdocs folder. Our .git was there. The very first thing I thought was. Why is this not in a sub folder? What if we are going to have more projects? It also took a coworker many hours and screwing around to get the astro project running on my PC.

We use 2 git repositories, 1 for the astro/html and 1 for the JS. This is also somewhat annoying. 2 sources of truth. What was worse. My coworkers used git pull on the target device to update it. So every time you had some experimental test thing you did not want to have in git, you would have to put it in git. The Astro project was updated with tight VNC and some good old fashioned manual dragging and dropping. I said to use something like a deployment script and FTP to deploy to the target machine. This was 2 years ago, we still do not have a decent deployment method.

So my conclusion was: nobody actually knows what we were doing.

The one thing however that exceeds all things. The extremely slow progress. My 2 coworkers clocked atleast 3 full weeks togather on making some IO screens. I swear that this would cost me one single day.. alone.. were I to use Qt or something else with a wyziwyg editor. I mean seriously.

Given the vague bugs and dumb things I had to burn my time on. I am convinced that either we doing everything the wrong way. And/or we are not using the right tools for the job. We make static machines with static GUIs. We don't make webpages.

What should we do really? We have new machine coming which I get to program. And I am not looking forward to have my 2 beloved coworkers crawling with their buggy html project on my machine. Is HTML really a good way to make static GUI's with? Are we doing things wrong or right? Is it supposed to be like this?

Any thoughts are welcome.

Kind regards,

Bas

Top comments (0)