webpack: splitChunks not working as expected

Do you want to request a feature or report a bug? Bug

What is the current behavior? When using splitChunks, if dealing with a simple project it’s working but in more complexe project with multiples inclusions, some dependencies are created for entry points that are not needed. The old commonChunk plugin was behaving correctly. Exemple :

const groupsOptions = {chunks: "all", minSize:0, minChunks: 1, reuseExistingChunk: true, enforce: true};

const reactConfig = {
    entry: {
        "react": ["react", "react-dom"],
        "pageA": "./src/A.jsx",
		"pageB": "./src/B.jsx",
        "pageC": "./src/C.jsx",
        "pageD": "./src/D.jsx",
        "commonAB": [ "./src/ab_a.js", "./src/ab_b.js"],
        "commonCD": ["./src/cd_c.js", "./src/cd_d.js"]
    },
    output: {
        path: __dirname + '/build/',
        filename: PROD
            ? "[name].min.js"
            : "[name].js"
    },
    module: {
        rules: [
            {
                test: /\.jsx$/,
                use: {
                    loader: "babel-loader",
                    options: {
                        presets: ["es2015", "react"]
                    }
                }
            }
        ]
    },
    optimization: {
        splitChunks: {
            cacheGroups:{
                react: {test:'react', name: "react", ...groupsOptions},
                AB: {test:'commonAB', name: "commonAB", ...groupsOptions},
                CD: {test:'commonCD', name: "commonCD", ...groupsOptions}
            }
        }
    },
    plugins: [
    ]
};

module.exports = reactConfig;

This produce : This exemple is very simple and everything is OK !

• pageA depends from pageA, react and commonAB -> OK
• pageB depends from pageB, react and commonAB -> OK
• pageC depends from pageC, react and commonCD -> OK
• pageD depends from pageD, react and commonCD -> OK

But then, when i modified the code of ab_a.js and add

import React from 'react';

the output is :

As you can see pageC and pageD depends of commonAB.js that is not the case (again with commonChunks plugin it was behaving correctly) !

• pageA depends from pageA, react and commonAB -> OK
• pageB depends from pageB, react and commonAB -> OK
• pageC depends from pageC, react and commonAB AND commonCD -> Wrong
• pageD depends from pageD, react and commonAB AND commonCD -> Wrong

Same result when i modified the code of cd_d.js and add import React from 'react'; the output is :

• pageA depends from pageA, react and commonAB AND commonCD -> Wrong
• pageB depends from pageB, react and commonAB AND commonCD -> Wrong
• pageC depends from pageC, react and commonCD AND commonAB -> Wrong
• pageD depends from pageD, react and commonCD AND commonAB -> Wrong

If the current behavior is a bug, please provide the steps to reproduce. Here sources to reproduce the bug : testCommon.zip

What is the expected behavior? With import React from 'react'; in ab_a.js, ab_b.js, cd_c.js and cd_d.js dependencies should be :

• pageA depends from pageA, react and commonAB
• pageB depends from pageB, react and commonAB
• pageC depends from pageC, react and commonCD
• pageD depends from pageD, react and commonCD

If this is a feature request, what is motivation or use case for changing the behavior?

Please mention other relevant information such as the browser version, Node.js version, webpack version, and Operating System. OS : Window 10 Webpack : 4.4.1 Node : 8.9.4