Duplicating WordPress CSS when browser is refreshing

supermueller commented 6 years ago

Quick, short summary:

Using browser refreshing on a WordPress website the WordPress theme’s CSS file will be duplicated each time. This causes hang up the browser after a while.

Expected results:

The WordPress theme’s CSS file should not be duplicated.

Actual results:

After each browser refresh CodeKit appends an additional link tag with the WordPress theme’s CSS file to the head of the html file (see code example at the end).

My configuration

In MAMP Pro the Website host is set to http://localhost.my-website.com:8888/.
In CodeKit the external server address is also set to http://localhost.my-website.com:8888/.
In WordPress the website url is also set to http://localhost.my-website.com:8888/.
The URI in the browser is http://localhost:5757/ (the IP or “This Mac only“ addresses also aren’t working).

Using CodeKit 3.5.2, WordPress 4.9.4–de_DE, Chrome 65.0.3325.181, MacOS 10.12.6, MAMP PRO 4.2.1

Code example:

<head>
        …
        <link rel="dns-prefetch" href="//s.w.org">
        <link rel="alternate" type="application/rss+xml" title="" href="http://localhost:5757/feed/">
        <link rel="alternate" type="application/rss+xml" title="" href="http://localhost:5757/comments/feed/">
        <link rel="stylesheet" id="child_theme-style-css" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4" type="text/css" media="all"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799588332" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799585373" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799588332" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799582600" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799588332" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799585373" media="all" id="child_theme-style-css"><link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799588333" media="all" id="child_theme-style-css">
        <link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen/genericons/genericons.css?ver=3.4.1&amp;now=1521799588333" media="all" id="genericons-css">
        <link type="text/css" rel="stylesheet" href="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/style.css?ver=4.9.4&amp;now=1521799588334" media="all" id="twentysixteen-style-css">
        <script type="text/javascript" src="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/js/libraries/jquery-2.1.1.min.js?ver=4.9.4"></script>
        <script type="text/javascript" src="http://localhost:5757/wordpress/wp-content/themes/twentysixteen-child/js/all.min.js?ver=4.9.4"></script>
        <link rel="https://api.w.org/" href="http://localhost:5757/wp-json/">
        <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost:5757/wordpress/xmlrpc.php?rsd">
        <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost:5757/wordpress/wp-includes/wlwmanifest.xml">
        <meta name="generator" content="WordPress 4.9.4">
        <link rel="canonical" href="http://localhost:5757/">
        <link rel="shortlink" href="http://localhost:5757/">
        <link rel="alternate" type="application/json+oembed" href="http://localhost:5757/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost.fourmotors.com%3A8888%2F">
        <link rel="alternate" type="text/xml+oembed" href="http://localhost:5757/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost.fourmotors.com%3A8888%2F&amp;format=xml">

    <!--Temporary CodeKit addition to enable browser refreshing--><script type="text/javascript">…</script>
</head>

bdkjones commented 6 years ago

It’s the localhost.my-website.com virtual host name. Switch that out for a simple vhost like project.site or something similar and you’ll be set

Sent from my iPhone

On Mar 23, 2018, at 03:25, Karsten Müller notifications@github.com wrote:

Quick, short summary:

Using browser refreshing on a WordPress website the WordPress theme’s CSS file will be duplicated each time. This causes hang up the browser after a while.

Expected results:

The WordPress theme’s CSS file should not be duplicated.

Actual results:

After each browser refresh CodeKit appends an additional link tag with the WordPress theme’s CSS file to the head of the html file (see code example at the end).

My configuration

In MAMP Pro the Website host is set to http://localhost.my-website.com:8888/. In CodeKit the external server address is also set to http://localhost.my-website.com:8888/. In WordPress the website url is also set to http://localhost.my-website.com:8888/. The URI in the browser is http://localhost:5757/ (the IP or “This Mac only“ addresses also aren’t working). Using CodeKit 3.5.2, WordPress 4.9.4–de_DE, Chrome 65.0.3325.181, MacOS 10.12.6, MAMP PRO 4.2.1

Code example:
…
— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

supermueller commented 6 years ago

Nope: I have renamed the host to localhost.mywebsite and still have this issue.

bdkjones commented 6 years ago

Right. Drop localhost; that’s the point. It should be something like “mywebsite.site” or “mysite.work” etc. Do not use .dev.

Sent from my iPhone

On Mar 23, 2018, at 08:13, Karsten Müller notifications@github.com wrote:

Nope: I have renamed the host to localhost.mywebsite and still have this issue.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

supermueller commented 6 years ago

… I have now tested it with “mywebsite.site” – still the same.

bdkjones commented 6 years ago

Which plugins are running on this WordPress site?

bdkjones / CodeKit

Duplicating WordPress CSS when browser is refreshing #449