Different Touch bar logos for two pages within a domain.

Dear developers,


I have two pages within a domain. One page is under the public folder, the other one is in the subdirectory.


Here are the codes of main page:


<link rel="apple-touch-icon" sizes="180x180" href="/main-apple-touch-icon.png">
<link rel="mask-icon" href="/main-safari-pinned-tab.svg" color="#50a9dc">


This is the second page in the subdirectory:


<link rel="apple-touch-icon" sizes="180x180" href="/sub-apple-touch-icon.png">
<link rel="mask-icon" href="/sub-safari-pinned-tab.svg" color="#3576b6">


Both pages already added to favorites. The issue is that when I open the new tab, the favorite page shows me the same pinned image for both URL. This happens also in the touch bar.


Strangely, this happens only with real domains in the web, this issue doesn't occur under my localhost.