We have a web page which we load inside the Android App and iOS App. the web page is having a header slot and footer slot and a banner slot for the image.
When developers attach the URL's of the images to the header, footer and banner slots most of the times the images are not fitting within the screens.
- They cross the boundaries of the screen size
- Image with text content is hidden by the button in the banner slot
We have to do an automation which actually checks if the images are not overlapped with the button in the banner slot and the images are not going beyond the screen sizes after the images appear in the device.
I checked few ideas like Sikuli and some screenshot comparison libraries. What I'm looking for is some tool that is closer to the human recognition which can tell whether the image is going beyond the limit. Automation should be able to check the image corners and borders or any design in the original image are also available in the image loaded in the slots in the mobile phone
I also used the OCR like Tesseract and Cuneiform OCR but the resultant text is not completely the correct text. These OCR's are able to fetch the Thick and large font but they are not able to fetch the small and thin font properly.
Can someone tell me which library or tool I can use to automate this?
I'm uploading the image how our web page looks like