jurek2006 / angular-contract-hours Goto Github PK

On Opera Mobile - the header and footer on the report preview occupies only part of available width (like only one column).

On non-mobile screens (when summary panel is on the right side) - enabling/disabling defined total hours (and showning/hiding errors) cases "jumping" of width of the panel. It doesn't look nice.

When user selects a input - screen keyboard appears and occupies large part of the screen. As on mobile summary panel also occupies the bottom part of left space on the screen - there is no space to see table/form with data.
It makes app in landscape mode impossible to use.
Moving summary panel to the left side on landscape mode should improve the situation.

Analyzing bundle size we can see at a glance there is big node_modules and one of the reasons are unused in application moment's locales.

Whole gzipped bundle is 390KB, where main (352KB) contains node_modules - 208KB (comparing to src size 140KB).

We can see that moment occupies in the bundle 71 KB and comprises 54KB of locales (which are unused, expect one or two).

On some mobile devices, in some browsers, downloading of PDF doesn't work at all (shows "page not found" or nothing happens. In other browsers downloading works but it lasts a few seconds and there is no indicator that something is happening.
On one android device:

• in firefox - download works (without indicator, user has to wait to long)
• in chrome and opera - after pressing "Download PDF" browser shows an error (without any further information)
• UC Browser crashes (and disappears ;) )

On second android device:

• works ok on chrome and samsung browser (without indicator, user has to wait to long)

It looks as a problem in jspdf. After short investigation there are some people experiencing the same issue in jspdf (no working short and easy solution found)

Opened schedule settings on safari mobile (and safari 11 also when resized) should have height: calc(100% - .5rem) [it can't be 100vh because there is difference of treating it in mobile browsers and browser bar can overlap the element].

There's a pop-up with message "Protocol not supported." (It looks like coming from browser or android). Message from application is - success.

After submitting contractor name and schedule month we can see input for amount of defined total hours is missing

Looking closer it is like (firefox):

should look like this:

After any interaction with scheduleForm (e.g. changing any day working status or scheduled hours) or with scheduleSummary (e.g. hovering on Generate PDF button) input "is back" (but is enabled and should be disabled)

After toggling isTotalHoursDefined checkbox works fine.

There's also an error "ERROR TypeError: Cannot read property 'disable' of undefined at AppDisableControlDirective.set [as appDisableControl] (app-disable-control.directive.ts:10)" (chrome) or "ERROR TypeError: "this.ngControl.control is undefined"" (firefox)
The error occurs only on first display of component scheduleSummary

As we can see analyzing bundle size (after making it smaller like in #7 ) - node_modules is slightly bigger than src:

Whole gzipped main is 296KB big, where src is 140KB and node_modules 155KB.
The biggest parts of node_modules are jspdf (86KB gzipped) and html2canvas (39KB gzipped)