Since Chrome version 79 you can toggle between `prefers-color-scheme: dark` and `prefers-color-scheme: light` from the *Rendering panel*

1. Open Developer tools (otherwise the key combination below opens the print dialog)
1. Open the Command Control: &lt;kbd&gt;Ctrl&lt;/kbd&gt;+&lt;kbd&gt;Shift&lt;/kbd&gt;+&lt;kbd&gt;P&lt;/kbd&gt; or &lt;kbd&gt;Command&lt;/kbd&gt;+&lt;kbd&gt;Shift&lt;/kbd&gt;+&lt;kbd&gt;P&lt;/kbd&gt; (Mac)
2. Type &quot;Show rendering&quot;
3. Set the **Emulate CSS media feature prefers-color-scheme** to the value you want to debug

[![drop down to select the mode][1]][1] 

  [1]: https://i.stack.imgur.com/E0BK5.png

How to emulate/activate prefers-color-scheme on Chrome (Desktop):

1. Press F12 key (or Command+Shift+C on Mac)
2. Click on the tree dots simbol (customize and control DevTools)
3. Point your mouse on the more tools option, and then click in rendering option.
4. the option Emulate CSS media feature prefers-color-scheme near the end it&#39;s your destination ! ![![dumb visual guide to open color scheme][1]][1]

[1]: https://i.stack.imgur.com/daDei.png

How to emulate/activate prefers-color-scheme on Chrome (Mobile):

1. Click on the tree dots simbol.
2. Click on Settings.
3. Click on theme.
4. Select you desired option !

Yay !!!
  

This is a Chrome DevTools feature request that is tracked in [crbug.com/977243][2] (star the bug or CC: yourself to be notified of progress). Meanwhile, it&#39;s already available in Safari&#39;s Web Inspector, see the heading *Debugging Dark Mode* in [Apple&#39;s blog post][1].

As an alternative, if you want to automate the whole process, I have written a [Puppeteer script that takes screenshots in dark and light mode][3], which can also be integrated in your CI testing. 


  [1]: https://webkit.org/blog/8840/dark-mode-support-in-webkit/
  [2]: https://crbug.com/977243
  [3]: https://github.com/tomayac/dark-mode-screenshot

On Chrome for **Android**, a flag was added in version 73 that adds a settings panel for dark theme, plus a checkbox for it in the browser menu. `chrome://flags/#darken-websites-checkbox-in-themes-setting`

[![Screenshot of flag &quot;Darken websites checkbox in themes setting&quot;][1]][1]

[![Screenshot of dark theme settings panel][2]][2]

[![Screenshot of dark theme checkbox in browser menu][3]][3]

  [1]: https://i.stack.imgur.com/vAUK0.png
  [2]: https://i.stack.imgur.com/lboNr.png
  [3]: https://i.stack.imgur.com/dTZhS.png


I am getting the following error suddenly while building Ionic 3 app for Android.

```none
Could not find org.jetbrains.kotlin:kotlin-stdlib-jdk8:1.3.60-eap-25
```

We have one solution from Android Studio [here][1] but after I did change in my build.gradle with the following code I am still getting the error.

    buildscript {
        repositories {
            ...
            maven { url &#39;https://dl.bintray.com/kotlin/kotlin-eap&#39; }
        }
    }
    
    allprojects {
        repositories {
            ...
            maven { url &#39;https://dl.bintray.com/kotlin/kotlin-eap&#39; }
        }
    }

My build.gradle file looks like this after I updated my Cordova and added the above solution.

    buildscript {
        repositories {
            google()
            jcenter()
            maven { url &#39;https://dl.bintray.com/kotlin/kotlin-eap&#39; }
        }
    
        dependencies {
            // NOTE: Do not place your application dependencies here; they belong
            // in the individual module build.gradle files
    
            classpath &#39;com.android.tools.build:gradle:3.3.0&#39;
        }
    }
    
    allprojects {
        repositories {
            google()
            jcenter()
            maven { url &#39;https://dl.bintray.com/kotlin/kotlin-eap&#39; }
        }
    
        //This replaces project.properties w.r.t. build settings
        project.ext {
          defaultBuildToolsVersion=&quot;28.0.3&quot; //String
          defaultMinSdkVersion=19 //Integer - Minimum requirement is Android 4.4
          defaultTargetSdkVersion=28 //Integer - We ALWAYS target the latest by default
          defaultCompileSdkVersion=28 //Integer - We ALWAYS compile with the latest by default
        }
    }
    
    task clean(type: Delete) {
        delete rootProject.buildDir
    }

Still the same error.


  [1]: https://androidstudio.googleblog.com/2019/10/android-studio-40-canary-1-available.html

Error: Could not find org.jetbrains.kotlin:kotlin-stdlib-jdk8:1.3.60-eap-25 in Ionic 3

I&#39;m working on a project with `react` using `typescript` and I&#39;m having a bad time figuring out why this error is happening, basically, I can&#39;t use any `createContext` examples that I found on the internet because of this.
This one specifically I got from here: https://github.com/typescript-cheatsheets/react-typescript-cheatsheet I&#39;m trying to use the same that is showing in the Context section.

    import * as React from &quot;react&quot;;

    export function createCtx&lt;A&gt;(defaultValue: A) {
    type UpdateType = React.Dispatch&lt;React.SetStateAction&lt;typeof defaultValue&gt;&gt;;
    const defaultUpdate: UpdateType = () =&gt; defaultValue;
    const ctx = React.createContext({
        state: defaultValue,
        update: defaultUpdate
    });
    function Provider(props: React.PropsWithChildren&lt;{}&gt;) {
        const [state, update] = React.useState(defaultValue);
        return &lt;ctx.Provider value={{ state, update }} {...props} /&gt;;
    }
    return [ctx, Provider] as [typeof ctx, typeof Provider];
    }

The issue is that everytime it says that there&#39;s this error
Cannot find namespace `ctx` in the line: 

            return &lt;ctx.Provider value={{ state, update }} {...props} /&gt;;

I&#39;m still not able to figure out why, someone can see if I&#39;m doing something wrong here? This is my tsconfig.json:

    {
    &quot;compilerOptions&quot;: {
    &quot;target&quot;: &quot;es5&quot;,
    &quot;lib&quot;: [
      &quot;dom&quot;,
      &quot;dom.iterable&quot;,
      &quot;esnext&quot;
    ],
    &quot;allowJs&quot;: true,
    &quot;skipLibCheck&quot;: true,
    &quot;esModuleInterop&quot;: true,
    &quot;allowSyntheticDefaultImports&quot;: true,
    &quot;strict&quot;: false,
    &quot;forceConsistentCasingInFileNames&quot;: true,
    &quot;module&quot;: &quot;esnext&quot;,
    &quot;moduleResolution&quot;: &quot;node&quot;,
    &quot;resolveJsonModule&quot;: true,
    &quot;isolatedModules&quot;: true,
    &quot;noEmit&quot;: true,
    &quot;jsx&quot;: &quot;preserve&quot;,
    &quot;noImplicitAny&quot;: false,
    &quot;strictNullChecks&quot;: false
    },
    &quot;include&quot;: [
    &quot;src&quot;
    ]
    }


Any help would be appreciated!

Cannot find namespace &#39;ctx&#39; error when creating Context with react - typescript

Chrome 76 has added support for `prefers-color-scheme` media query (a.k.a. &quot;dark mode&quot;). 

But how can I test my webpage in both color schemes easily, without toggling the system dark mode on and off?

Here is the [same question](https://stackoverflow.com/questions/56401662/firefox-how-to-test-prefers-color-scheme) for Firefox, but I can&#39;t find similar settings in Chrome &amp; Chrome DevTools.

How can I emulate prefers-color-scheme media query in Chrome?

Chrome 76 has added support for <code>prefers-color-scheme</code> media query (a.k.a. "dark mode").
But how can I test my webpage in both color schemes easily, without toggling the system dark mode on and off?
Here is the <a href="https://stackoverflow.com/questions/56401662/firefox-how-to-test-prefers-color-scheme" target="_blank" rel="noopener noreferrer">same question</a> for Firefox, but I can't find similar settings in Chrome &#x26; Chrome DevTools.

I have learnt to use animation in CSS using `@keyframe`. I however want to write my custom animation code to my React project (using MUI). My challenge is how I can write the Javascript code to custom my animations using the `makeStyle()` in MUI.

I want to be able to custom the transitions processes in percentages
this time around in MUI. I need to be able to write codes like this in `makeStyle()` but I don&#39;t seem to know how to.

&lt;!-- language: lang-css --&gt;

    @keyframes myEffect {
     0%{
      opacity:0;
      transform: translateY(-200%); 
     }

    100% {
      opacity:1;
      transform: translateY(0);
     }
    }



How to apply custom animation effect @keyframes in MUI?

  I use tailwindCSS and confront a problem with make footer.


**base.html**

      &lt;body&gt;
        {% include &quot;partials/nav.html&quot; %}
    
        {% block content %}
        {% endblock %}
    
        {% include &quot;partials/footer.html&quot; %}
      &lt;/body&gt;


**footer.html**

    &lt;footer class=&quot;w-full h-64 bg-gray-900 static bottom-0&quot;&gt;
            {% load static %}
            &lt;img src=&quot;{% static &quot;images/logo_white.png&quot; %}&quot; width=&quot;70px&quot;&gt; &lt;p class=&quot;text-white&quot;&gt; &amp;copy~~~~~~&lt;/p&gt;
    &lt;/footer&gt;

i tried static,absolute,fixed,relative... but .fixed cover the content block and relative make footer going upside. or .mb-0, .bottom-0 doesn&#39;t work.

is it possible make footer fixed on the bottom?

Tailwindcss: fixed/sticky footer on the bottom

I intended to use `Document.execCommand()` method along with `contenteditable` attribute to build my custom WYSIWYG editor. But when I checked the [documentation][1] for `Document.execCommand()`, I found that it&#39;s now obsolete. What&#39;s the modern (or extant) alternative for it?

  [1]: https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand

execCommand() is now obsolete, what&#39;s the alternative?

I was working on webpack 4.44.2, I face this error when I convert to webpack5.0.0

**ERROR in ./src/assets/sass/styles.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
Error: Automatic publicPath is not supported in this browser
    at E:\maktab\Control-panel\newcontrol\final-control\node_modules\css-loader\dist\cjs.js!**

the error is from the font file bath in fonts.scss

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-css --&gt;

    @font-face {
        font-family: &quot;Janna LT&quot;;
        src: local(&quot;Janna LT&quot;), url(../fonts/janna.woff) format(&quot;woff&quot;);
        font-weight: normal;
    }

    @font-face {
        font-family: &quot;Janna LT&quot;;
        src: local(&quot;Janna LT&quot;), url(../fonts/janna-bold.woff) format(&quot;woff&quot;);
        font-weight: bold;
    }


&lt;!-- end snippet --&gt;

my src structure
https://i.stack.imgur.com/vKyfW.png

dist structure 
https://i.stack.imgur.com/mLgmF.png

webpack.config.js

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-js --&gt;

    const path = require(&#39;path&#39;);

    const MiniCssExtractPlugin = require(&#39;mini-css-extract-plugin&#39;);
    const OptimizeCSSAssetsPlugin = require(&quot;optimize-css-assets-webpack-plugin&quot;);
    const HtmlWebpackPlugin = require(&quot;html-webpack-plugin&quot;);
    const { CleanWebpackPlugin } = require(&#39;clean-webpack-plugin&#39;);

    module.exports = {
        entry:  {
          &#39;main&#39;: &#39;./src/index.js&#39;,
        },
      
        output: {
          path: path.join(__dirname, &quot;/dist&quot;),
          filename: &#39;[name].js&#39;,
        }, 

        devServer: {
            contentBase: path.join(__dirname, &quot;/dist&quot;),
            port: 8087,
            writeToDisk: true,
            overlay :true
        },
        

        module: {
            rules: [
        
                {
                    test: /\.html$/,
                    use: [
                        {
                            loader: &quot;html-loader&quot;,
                        }
                    ]
                },

                {
                    test: /\.(sa|sc|c)ss$/,
                    use: [
                    MiniCssExtractPlugin.loader, 
                    &#39;css-loader&#39;, 
                    &#39;postcss-loader&#39;,
                    &#39;sass-loader&#39;
                    ]
                },
                        
                {
                    test: /\.(png|svg|jpe?g|gif)$/,
                    exclude: /fonts/,
                    use: [
                        {
                            loader: &quot;file-loader&quot;, 
                            options: {
                            name: &#39;[name].[ext]&#39;,
                            outputPath: &quot;/assets/images&quot;,
                            }
                        }
                    ]
                },

                {
                    test: /\.(svg|eot|woff|woff2|ttf)$/,
                    exclude: /images/,
                    use: [
                        {
                            loader: &quot;file-loader&quot;, 
                            options: {
                            name: &#39;[name].[ext]&#39;,
                            outputPath: &quot;assets/fonts&quot;,
                            }
                        }
                    ]
                },

            ]
        },

        plugins: [
            new CleanWebpackPlugin(),

            new HtmlWebpackPlugin({ 
              filename: &quot;index.html&quot;,
              template: &quot;./src/index.html&quot;,
              chunks: [&#39;main&#39;]
            }),
          

            new MiniCssExtractPlugin({filename: &quot;assets/css/styles.css&quot;}),
            new OptimizeCSSAssetsPlugin({}),
        ]
        
    } 


&lt;!-- end snippet --&gt;

styles.scss

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-css --&gt;

    @import &quot;base/fonts&quot;;
    @import &quot;base/global&quot;;
    @import &quot;base/typography&quot;;
    @import &quot;base/links&quot;;
    @import &quot;components/components&quot;;
    @import &quot;components/demo&quot;;

&lt;!-- end snippet --&gt;

index.js

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-js --&gt;

    import &#39;./assets/sass/styles.scss&#39;;
    import &#39;normalize.css/normalize.css&#39;;

    console.log(&quot;hellow from webpack5&quot;);

&lt;!-- end snippet --&gt;




Webpack5 Automatic publicPath is not supported in this browser

I&#39;d like to simulate a &quot;scan&quot; light that will reveal words in a box, this is my code by now:

&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-js --&gt;

    const e = document.getElementsByClassName(&#39;scan&#39;)[0];
    document.onmousemove = function(event){
      e.style.left = `${event.clientX}px`;
    };

&lt;!-- language: lang-css --&gt;

    *{
        margin: 0;
        padding: 0;
    }

    html, body{
        width: 100%;
        min-height: 100vh;
        overflow-x: hidden;
        
        display: flex;
    }

    .banner{
        width: 100vw;
        height: 100vh;

        display: flex;
        flex-grow: 1;
        flex-direction: row;
        align-items: center;
        background-color: #031321;
    }

    .banner .scan{
        width: 7px;
        height: 80%;
        
        position: absolute;
        left: 30px;
        z-index: 3;

        transition: left 50ms ease-out 0s;
        
        border-radius: 15px;
        background-color: #fff;
        box-shadow:
            0 0 15px 5px #fff,  /* inner white */
            0 0 35px 15px #008cff, /* inner blue */
            0 0 350px 20px #0ff; /* outer cyan */
    }

    .banner .description{
        width: 100%;
        color: white;
        font-size: 3em;
        text-align: center;

        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

&lt;!-- language: lang-html --&gt;

    &lt;div class=&quot;banner&quot;&gt;
        &lt;div class=&quot;scan&quot;&gt;&lt;/div&gt;
        &lt;div class=&quot;description&quot;&gt;
            Just trying something
        &lt;/div&gt;
    &lt;/div&gt;

&lt;!-- end snippet --&gt;


The idea is the show the words in the `.description` div according to the scan light position. If possible I&#39;d like to use CSS only to make this effect, and use JavaScript only to move the scan (which will further become a CSS animation). I tried to use some pseudo elements, but it didn&#39;t work well. [Here&#39;s][1] an example of how this animation should work.


  [1]: https://www.instagram.com/p/CAnWSAnD2yo/

How to make this illumination effect with CSS

Is anybody else getting this Chrome console warning? 

&gt; A cookie associated with a cross-site resource at &lt;URL&gt; was set
&gt; without the `SameSite` attribute. A future release of Chrome will only
&gt; deliver cookies with cross-site requests if they are set with
&gt; `SameSite=None` and `Secure`. You can review cookies in developer
&gt; tools under Application&gt;Storage&gt;Cookies and see more details at &lt;URL&gt;
&gt; and &lt;URL&gt;.

In Chrome Flags chrome://flags/ I&#39;ve tried disabling both: 

 - SameSite by default cookies
   
 - Cookies without SameSite must be secure

And the warning won&#39;t go away. 


Chrome Console SameSite Cookie Attribute Warning

I&#39;m currently working on a website, which triggers a ```net::ERR_HTTP2_PROTOCOL_ERROR 200``` error on Google Chrome. I&#39;m not sure exactly what can provoke this error, I just noticed it pops out only when accessing the website in HTTPS. I can&#39;t be 100% sure it is related, but it looks like it prevents JavaScript to be executed properly.

For instance, the following scenario happens :

1. I&#39;m accessing the website in HTTPS

2. My Twitter feed integrated via https://publish.twitter.com  isn&#39;t loaded at all 

3. I can notice in the console the ERR_HTTP2_PROTOCOL_ERROR

4. If I remove the code to load the Twitter feed, the error remains

5. If I access the website in HTTP, the Twitter feed appears and the error disappears 

Google Chrome is the only web browser triggering the error: it works well on both Edge and Firefox.
(NB: I tried with Safari, and I have a similar ```kcferrordomaincfnetwork 303``` error)

I was wondering if it could be related to the header returned by the server since there is this &#39;200&#39; mention in the error, and a 404 / 500 page isn&#39;t triggering anything. 

Thing is the error isn&#39;t documented at all. Google search gives me very few results. Moreover, I noticed it appears on very recent Google Chrome releases; the error doesn&#39;t pop on v.64.X, but it does on v.75+ (regardless of the OS; I&#39;m working on Mac tho).

----------


Might be related to https://stackoverflow.com/questions/49927327/website-ok-on-firefox-but-not-on-safari-kcferrordomaincfnetwork-error-303-neit


----------


Findings from further investigations are the following:

 - **error doesn&#39;t pop on the exact same page if server returns 404 instead of 2XX**
 - error doesn&#39;t pop on local with a HTTPS certificate
 - error pops on a different server (both are OVH&#39;s), which uses a different certificate
 - error pops no matter what PHP version is used, from 5.6 to 7.3 (framework used : Cakephp 2.10)

As requested, below is the returned header for the failing ressource, which is the whole web page. Even if the error is triggering on each page having a HTTP header 200, those pages are always loading on client&#39;s browser, but sometimes an element is missing (in my exemple, the external Twitter feed). Every other asset on the Network tab has a success return, except the whole document itself. 
[![line that failed in console][1]][1]

Google Chrome header (with error):

[![Chrome header][2]][2]


Firefox header (without error):

[![Firefox header][3]][3]

A ```curl --head --http2``` request in console returns the following success:
```
HTTP/2 200 
date: Fri, 04 Oct 2019 08:04:51 GMT
content-type: text/html; charset=UTF-8
content-length: 127089
set-cookie: SERVERID31396=2341116; path=/; max-age=900
server: Apache
x-powered-by: PHP/7.2
set-cookie: xxxxx=0919c5563fc87d601ab99e2f85d4217d; expires=Fri, 04-Oct-2019 12:04:51 GMT; Max-Age=14400; path=/; secure; HttpOnly
vary: Accept-Encoding
```

----------

Trying to go deeper with the chrome://net-export/ and https://netlog-viewer.appspot.com tools is telling me the request ends with a RST_STREAM :
```
t=123354 [st=5170]    HTTP2_SESSION_RECV_RST_STREAM
                      --&gt; error_code = &quot;2 (INTERNAL_ERROR)&quot;
                      --&gt; stream_id = 1
```
For what I read in [this other post][4], &quot;*In HTTP/2, if the client wants to abort the request, it sends a RST_STREAM. When the server receives a RST_STREAM, it will stop sending DATA frames to the client, thereby stopping the response (or the download). The connection is still usable for other requests, and requests/responses that were concurrent with the one that has been aborted may continue to progress.
[...]
It is possible that by the time the RST_STREAM travels from the client to the server, the whole content of the request is in transit and will arrive to the client, which will discard it. However, for large response contents, sending a RST_STREAM may have a good chance to arrive to the server before the whole response content is sent, and therefore will save bandwidth.*&quot;

The described behavior is the same as the one I can observe. But that would mean the browser is the culprit, and then I wouldn&#39;t understand why it happens on two identical pages with one having a 200 header and the other a 404 (same goes if I disable JS).
 

  [1]: https://i.stack.imgur.com/ZkdHo.png
  [2]: https://i.stack.imgur.com/0wCrD.png
  [3]: https://i.stack.imgur.com/AAtn8.png
  [4]: https://stackoverflow.com/questions/28736463/rst-stream-frame-in-http2

What&#39;s the net::ERR_HTTP2_PROTOCOL_ERROR about?

Since the last update, I&#39;m having an error with cookies, related with SameSite attribute.

The cookies are from third party developers (Fontawesome, jQuery, Google Analytics, Google reCaptcha, Google Fonts, etc.)

The errors in the Chrome console are like this.

``` lang-none
A cookie associated with a cross-site resource at &lt;URL&gt; was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at &lt;URL&gt; and &lt;URL&gt;.
(index):1 A cookie associated with a cross-site resource at http://jquery.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at http://fontawesome.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at http://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at https://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at https://www.google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at http://www.google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
(index):1 A cookie associated with a cross-site resource at http://gstatic.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application&gt;Storage&gt;Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
````

Is there anything I need to do in my local machine or server or is just some feature they should implement in future releases of their libraries?

SameSite warning Chrome 77

I try to get my local development in Chrome back running, but Chrome prevents that, with the message that the certificate is invalid. Even though it could not be the date of the certificate, as you can see in the screenshot of it:

[![enter image description here][1]][1]

I just wonder why there is no advanced &gt; option to proceed anyway to see the website and being able to locally develop the app.

A few more things to mention:

 - The local development runs on
   https://local.app.somecompany.com:4200/. It can&#39;t be just localhost,
   because otherwise our authentication http-only cookies won&#39;t work in
   Chrome.
 - Therefore the host file under etc/hosts was adjusted to
   point to the localhost IP adress (127.0.0.1).
 - The certificate was
   generated with openssl according to this [tutorial][2] and this
   [repo][3]
 - The certificate works for a colleague with the exact same
   Chrome version but with a MacOS version 10.14.6 (mine right now is
   MacOS 10.15.1)
 - The chrome flag(chrome://flags/#allow-insecure-localhost) does not change anything
 - Also works in firefox on my laptop.

Can&#39;t find anything online that helped me to solve this so far, so I would be extremly thankful, if anyone has some more ideas what I could try!?


Specs:

 - OS: MacOS 10.15.1
 - Chrome: 78.0.3904.97

  [1]: https://i.stack.imgur.com/EDHew.png
  [2]: https://medium.com/@rubenvermeulen/running-angular-cli-over-https-with-a-trusted-certificate-4a0d5f92747a
  [3]: https://github.com/RubenVermeulen/generate-trusted-ssl-certificate

No “Proceed Anyway” option on NET::ERR_CERT_INVALID in Chrome on MacOS

I am currently new to robot framework.I am currently using latest window version of chrome and chromedriver which is 80 but when i try to run the test it gives the message &quot;SessionNotCreatedException: Message: session not created: This version of ChromeDriver only supports Chrome version 81&quot; in pycharm but currently beta version of 81 is only available. I have tried uninstalling everthing and reinstalling it again but nothing works can anyone help me with this.Thank you!

Screenshots below:
[![1][1]][1]

[![2][2]][2]

  [1]: https://i.stack.imgur.com/6IHIF.png
  [2]: https://i.stack.imgur.com/FKkZM.png

Content Type	Original Author	Original Content on Stackoverflow
Question	xmcp	View Question on Stackoverflow
Solution 1 - Css	AV Paul	View Answer on Stackoverflow
Solution 2 - Css	Marlon da Veiga	View Answer on Stackoverflow
Solution 3 - Css	DenverCoder9	View Answer on Stackoverflow
Solution 4 - Css	Scott Martin	View Answer on Stackoverflow

How can I emulate prefers-color-scheme media query in Chrome?

Css Problem Overview

Css Solutions

Solution 1 - Css

Solution 2 - Css

Solution 3 - Css

Solution 4 - Css

Cannot find namespace 'ctx' error when creating Context with react - typescript

Error: Could not find org.jetbrains.kotlin:kotlin-stdlib-jdk8:1.3.60-eap-25 in Ionic 3

Attributions