check font in Test complete

Hi,

I think that you can check what font is requested to be used for this or that web element by checking its CSS computed style (https://community.smartbear.com/t5/TestComplete-Functional-Web/WaitProperty-on-styles/m-p/149995#M30634).

What I am not sure how to check is how to check that the element was indeed rendered using the requested font but some font substitution was not used because of some reason (font is absent on the system, some registry settings, some browser settings, etc.).

It seems to be, that the provided solution indeed only checks if the font is correct in the code, but it doesn't verify that the font visible is the correct one. Which was exactly the thing I wanted to check.

Might it be the case that I'm not looking in the correct place, or would we indeed need some graphical check?

If we need a graphical check, what would be the best way to do this?

I do get errors in the console that the font cannot be loaded, but I can't imagine this would be the only way to check.

I have used the code of AlexKaras his link to another thread and modified it a bit.

With that code, I get a property back with a value I expect. But It always gives this value, even when it wasn't possible to load the font.

function getCSSProperty(element, prop){
     var style;
     style = Aliases.browser.Page('*').contentDocument.defaultView.getComputedStyle(element, '');
     return style.getPropertyValue(prop);
}

function checkCSSProperty(element, prop, checkValue){
    var testValue;
    testValue = getCSSProperty(element, prop);
    testValueArray = testValue.split(',');
    testValue = testValueArray[0];
    testValue = testValue.trim();
    
    if (checkValue.indexOf(testValue) >= 0) {
        Log.Checkpoint(prop + ' has value of ' + checkValue);
    } 
    else {
        Log.Error(prop + ' value of ' + testValue + ' does not match ' + checkValue);
    } 
}