Crash with "req.handle.writev is not a function" on Socket.Writable.uncork

Version: 10.6.0
Platform: Darwin 18.0.0 Darwin Kernel Version 18.0.0: Wed Jun 27 22:28:20 PDT 2018; root:xnu-4903.200.274.31.2~2/RELEASE_X86_64 x86_64
Subsystem: net

This is a node internal crash that happens with webpack-dev-server, likely with any config, only when running on node 10.6.0:

internal/stream_base_commons.js:59
  var err = req.handle.writev(req, chunks, allBuffers);
                       ^

TypeError: req.handle.writev is not a function
    at writevGeneric (internal/stream_base_commons.js:59:24)
    at Socket._writeGeneric (net.js:758:5)
    at Socket._writev (net.js:767:8)
    at doWrite (_stream_writable.js:408:12)
    at clearBuffer (_stream_writable.js:517:5)
    at Socket.Writable.uncork (_stream_writable.js:314:7)
    at connectionCorkNT (_http_outgoing.js:646:8)
    at process._tickCallback (internal/process/next_tick.js:63:19)

The same webpack-dev-server with the same config has no crash on node 10.4.1 and runs successfully.

a minimal reproduce please?

Not OP & don't have a minimal reproduce as such unfortunately, but I'm having the same problem on my local build (Mac OS X v 10.13.4) and others have verified on the same OS. Seems to happen on build while building the ttf2woff2 module, and while running it happens with some XHRs that timeout, but sometimes it just appears to fall over with no consistent pattern. It doesn't happen every time that we build using 10.6.0, but if it doesn't happen during build it always happens at some point while running, usually within 5-20 minutes.

Building the ttf2woff2 module is the longest stage of our build process and therefore it may be just a coincidence that this error tends to throw during this particular stage (i.e. it could happen any time but this is the time it's most likely to happen statistically), or it may be that long-running processes themselves cause the issue. This is about as helpful as I can get I'm afraid, it's all I can tell from where I'm sat.

We're currently just reverting to an earlier version, we haven't found a reliable workaround.

Im getting the same issue.
Version: 10.6.0
Platform: OSX HighSierra 10.13.6

when running webpack-dev-server, and seems to only happen when im accessing the page from IOS device.

Since this already has 18 upvotes: Please provide a way to reproduce this. It seems like enough people are running into this issue to make that possible…

Boy this is complicated.

I was able to create a reproducible flow for this:

Clone and npm install this https://github.com/WesleydeSouza/subway-time
Run HTTPS=1 node scripts/start.js
Using an iOS device or simulator navigate to https://[IP]:3000
Calls will start to fail

Trying to run the server again will fail because the client still calls /eventsource repeatedly, which immediately crashes the server again.

I'm on macOS 10.14 18A326h (Mojave), and tested on iOS 11.4 simulator and a device with iOS 12, always with the same results. Desktop Chrome doesn't trigger this problem.

I ran into this issue when I was running Node 10 in a new shell while trying to start a Node 7 project. Try rm -rf node_modules && nvm use 7 && yarn install if all else fails.

Same issue running Node v10.7.0 on Ubuntu 18.04, with the latest webpack-dev-server, and accessing with Chromium

@YvanGuidoin

@YvanGuidoin is it possible for you to provide what are you actually running with the webpack-dev-server? As it seems that we may be able to reproduce your case much more easily than @wesleydesouza one (I actually tried that one with MacOS in VBox but I guess it's outdated enough to not trigger this bug).

same, webpack-dev-server down.

    "webpack": "3.8.1",
    "webpack-dev-server": "2.9.4",

same. Windows 10 Node v10.7.0 using angular
"@angular-devkit/build-angular": "~0.6.8",
"@angular/cli": "^6.0.8",
"@angular/compiler-cli": "6.0.9",
rebooted my machine and the problem is gone.

For now.

@lundibundi

@lundibundi I can't give you access to the code sorry ;) but I cleaned our webpack config from the "private" parts so you can see it

const path = require("path");
const webpack = require("webpack");
const autoprefixer = require("autoprefixer");
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const OfflinePlugin = require("offline-plugin");
const WebpackPwaManifest = require("webpack-pwa-manifest");
const LodashModuleReplacementPlugin = require("lodash-webpack-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");

const confHotReload = {
  contentBase: path.resolve(__dirname, "dist"),
  compress: false,
  historyApiFallback: true,
  hot: true,
  https: true,
  index: "index.html",
  open: false,
  inline: true,
  overlay: true,
  watchOptions: {
    poll: true,
    ignored: [/node_modules/, "**/*.d.ts"],
  },
  port: 9000,
  proxy: {
    // some apis
  },
};
const configProxy = {
  target: "https://localhost/",
  secure: false,
  changeOrigin: true,
  ws: true,
  proxyTimeout: 60000,
};

const getPlugins = function getPlugins(isProd, isHot) {
  const pluginsProduction = [
    new CleanWebpackPlugin(["dist/*"]),
    new LodashModuleReplacementPlugin(),
    new OfflinePlugin({
      appShell: "/",
      externals: ["https://fonts.googleapis.com/css?family=Montserrat", "/"],
      ServiceWorker: {
        minify: true,
        events: true,
      },
      autoUpdate: true,
      AppCache: false,
      excludes: ["**/*.d.ts", "**/locale/*.js"],
    }),
    new WebpackPwaManifest({
      name: "Test",
      short_name: "Test",
      background_color: "#ffffff",
      fingerprints: true,
      inject: true,
      theme_color: "#ff7f27",
      start_url: "/",
      icons: [
        {
          src: path.resolve("public/splash.png"),
          sizes: [36, 128, 192, 256, 384, 512], // multiple sizes
        },
      ],
    }),
    new BundleAnalyzerPlugin({
      analyzerMode: "static",
      openAnalyzer: false,
      logLevel: "error",
    }),
  ];

  const commonsPlugins = [
    new webpack.DefinePlugin({
      "process.env": {
        NODE_ENV: JSON.stringify(isProd ? "production" : "development"),
        BROWSER: true,
      },
      DOMAIN_API: JSON.stringify(process.env.DOMAIN_API),
    }),
    new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/), // not included in bundle
    new HtmlWebpackPlugin({
      template: "public/index.html",
      filename: "index.html",
      inject: true,
      chunksSortMode: "none",
      cache: isHot,
      minify: {
        preserveLineBreaks: true,
        html5: true,
        removeComments: false,
        collapseWhitespace: true,
      },
      favicon: "public/favicon.png",
    }),
    new HtmlWebpackPlugin({
      template: "public/unsupported.html",
      filename: "unsupported.html",
      inject: false,
      chunksSortMode: "none",
      cache: isHot,
      minify: {
        preserveLineBreaks: true,
        html5: true,
        removeComments: false,
        collapseWhitespace: true,
      },
      favicon: "public/favicon.png",
    }),
    new MiniCssExtractPlugin({
      filename: "[name].css",
      chunkFilename: "[id].css",
    }),
    new CopyWebpackPlugin([
      {
        context: "node_modules/moment/locale",
        from: "*",
        to: "./locale/",
      },
      {
        context: "node_modules/videojs-contrib-hls/dist",
        from: "videojs-contrib-hls.min.js",
        to: "./videojs/",
      },
      {
        context: "node_modules/video.js/dist",
        from: "video.min.js",
        to: "./videojs/",
      },
      {
        context: "public/",
        from: "robots.txt",
        to: ".",
      },
    ]),
  ];
  if (isHot) {
    commonsPlugins.push(new webpack.HotModuleReplacementPlugin());
  }
  const pluginsToUse = isProd ? [...commonsPlugins, ...pluginsProduction] : commonsPlugins;
  return pluginsToUse;
};
const aliases = {
  moment$: "moment/moment",
  "react-loadable": "@7rulnik/react-loadable",
  // ... private aliases for modules
};

const webpackStatsProd = {
  children: true,
  chunks: false,
  chunkModules: false,
  chunkOrigins: false,
  optimizationBailout: true,
  source: false,
};

module.exports = function(env) {
  const isHot = (env && env.hot) || false;
  const isProd = (!isHot && (env && env.production)) || false;

  const pluginsToUse = getPlugins(isProd, isHot);

  return {
    cache: !isProd,
    devtool: false,
    mode: !isProd ? "development" : "production",
    stats: isProd ? webpackStatsProd : "minimal",
    entry: path.resolve(__dirname, "src", "check.ts"),
    output: {
      path: path.resolve(__dirname, "dist"),
      filename: isProd ? "[chunkhash].js" : "[name].bundle.js",
      chunkFilename: isProd ? "[chunkhash].chunk.js" : "[name].chunk.js",
      pathinfo: !isProd,
    },
    devServer: confHotReload,
    performance: {
      hints: isProd ? "warning" : false,
    },
    optimization: {
      splitChunks: { chunks: "all", cacheGroups: {} },
      sideEffects: false,
      minimize: isProd,
      minimizer: [
        new UglifyJsPlugin({
          uglifyOptions: {
            ecma: 7,
          },
          cache: false,
          parallel: true,
          sourceMap: false,
        }),
      ],
      runtimeChunk: false,
      concatenateModules: isProd,
    },
    resolve: {
      extensions: [".tsx", ".ts", ".jsx", ".js", ".json"],
      mainFields: ["module", "browser", "main"],
      alias: aliases,
      modules: [path.resolve(__dirname, "node_modules")],
    },
    target: "web",
    module: {
      rules: [
        {
          test: function(modulePath) {
            return (
              modulePath.endsWith(".ts") | modulePath.endsWith(".tsx") &&
              !(modulePath.endsWith("test.ts") | modulePath.endsWith("test.tsx"))
            );
          },
          use: [
            {
              loader: "babel-loader",
              options: {
                cacheDirectory: !isProd,
              },
            },
            "ts-loader",
          ],
          include: /src/,
          exclude: /node_modules/,
        },
        {
          test: /\.(js|jsx)$/,
          use: {
            loader: "babel-loader",
            options: {
              cacheDirectory: !isProd,
            },
          },
          include: /src/,
          exclude: /node_modules/,
        },
        {
          test: /\.css$/,
          use: [
            isHot ? { loader: "style-loader", options: { hmr: true } } : MiniCssExtractPlugin.loader,
            { loader: "css-loader", options: { minimize: isProd } },
            // {
            //   loader: "postcss-loader",
            //   options: {
            //     plugins: [autoprefixer],
            //   },
            // },
          ],
        },
        {
          test: /\.scss$/,
          use: [
            isHot ? { loader: "style-loader", options: { hmr: true } } : MiniCssExtractPlugin.loader,
            {
              loader: "typings-for-css-modules-loader",
              query: {
                modules: true,
                localIdentName: isProd ? "[hash:base64:10]" : "[name]__[local]",
                camelCase: false,
                namedExport: true,
                banner:
                  "// This file is automatically generated by typings-for-css-modules.\n// Please do not change this file!",
              },
            },
            {
              loader: "postcss-loader",
              options: {
                plugins: [autoprefixer],
              },
            },
            {
              loader: "sass-loader",
              query: {
                modules: true,
              },
            },
          ],
        },
        {
          test: /\.(jpe?g|png|gif|ogg|mp4|woff|woff2|ttf|eot)$/i,
          use: {
            loader: "file-loader",
            options: {
              name: "[name].[ext]",
              outputPath: "assets/",
            },
          },
        },
        {
          test: /\.svg/,
          use: [
            {
              loader: "file-loader",
              options: {
                name: "[name].[ext]",
                outputPath: "assets/",
              },
            },
            {
              loader: "svgo-loader",
              options: {
                plugins: [
                  { removeTitle: true },
                  { cleanupAttrs: true },
                  { removeComments: true },
                  { removeUnknownsAndDefaults: true },
                  { removeDesc: true },
                  { convertColors: { shorthex: false } },
                  { convertPathData: false },
                ],
              },
            },
          ],
        },
      ],
    },
    plugins: pluginsToUse,
  };
};

and the error I have

ℹ ｢wdm｣: Compiled successfully.
internal/stream_base_commons.js:59
  var err = req.handle.writev(req, chunks, allBuffers);
                       ^

TypeError: req.handle.writev is not a function
    at writevGeneric (internal/stream_base_commons.js:59:24)
    at Socket._writeGeneric (net.js:759:5)
    at Socket._writev (net.js:768:8)
    at doWrite (_stream_writable.js:408:12)
    at clearBuffer (_stream_writable.js:517:5)
    at Socket.Writable.uncork (_stream_writable.js:314:7)
    at connectionCorkNT (_http_outgoing.js:644:8)
    at process._tickCallback (internal/process/next_tick.js:63:19)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR!<[project]>@1.1.0 start: `DOMAIN_API=localhost:9000 webpack-dev-server --env.hot`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the <[project]>@1.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Edit: Two of webpack dev server proxy path are used for Websocket connections to our backend launched in Docker locally, don't know if that might have an impact?

@YvanGuidoin

@YvanGuidoin Do you think you could work out a full reproduction based on this?

@addaleax

@addaleax Tried to recreate a cleaned reproduction, but it isn't happening wihout the backend, and tried to recreate it with clean code (create-react-app) and a websocket server it's not happening either (even when calling 9/10 websocket in parallel per browser) ><

@YvanGuidoin

@YvanGuidoin Can you provide other information about the issue? Maybe you could attach the inspector to the Node process and see what the actual values of req.handle/req.handle.writev are?

Fix server: don't use spdy on node >= v10.0.0

Backports fix for webpack#1449

I was getting this error on Windows 10 x64 on NodeJS version 10.13.0. I simply removed NodeJS version 10.13.0 and installed version 8.11.3 and restarted my machine and it was gone!

Is there a fix or a workaround for this that doesn't require using node 8?

Using node 10.10 and angular 5 I get this error when I run the angular serve command. It only occurs when using the iOS simulator. It may have something to do with which version I'm emulating, definitely happens on iPad 9.2. I don't recall if it occurs in 12, or if I just haven't had it running long enough to trigger the error.

@nicholas-eden

@nicholas-eden spdy-http2/handle-thing#5 should have fixed this on the spdy side, so updating your dependencies might help.

Otherwise, you may need to provide steps to reproduce in order for people to be able to help you.

I don't know how reproducible this is on other projects, but here's what's happening:

Start the node server using ng serve
Access via chrome to verify it's up
Bring up an iPad 12 instance on Simulator
Open the page on https on the iPad instance

Strangely, this doesn't happen with an iPad 9 or 10 instance.

This is my error log:

TypeError: req.handle.writev is not a function
    at writevGeneric (internal/stream_base_commons.js:62:24)
    at Socket._writeGeneric (net.js:711:5)
    at Socket._writev (net.js:720:8)
    at doWrite (_stream_writable.js:408:12)
    at clearBuffer (_stream_writable.js:517:5)
    at Socket.Writable.uncork (_stream_writable.js:314:7)
    at connectionCorkNT (_http_outgoing.js:641:8)
    at process._tickCallback (internal/process/next_tick.js:63:19)
child_process.js:651
    throw err;
    ^

I have same problem when open page on https with IPhone X.
node version 10.6.0 -> occur 'req.writev is not a function' error
But, It worked fine on a desktop browser.

And i solved this problem with change node version to 8.11.3

webpack-dev-server version : 3.2.1

Same issue here
Ubuntu 16.04 64 bits
nodejs v10.15.0

Using create-react-script and it crashes when I use chrome on my cellphone. Chrome on my desktop doesn't produce this failure.

internal/stream_base_commons.js:62
var err = req.handle.writev(req, chunks, allBuffers);
^

TypeError: req.handle.writev is not a function
at writevGeneric (internal/stream_base_commons.js:62:24)
at Socket._writeGeneric (net.js:715:5)
at Socket._writev (net.js:724:8)
at doWrite (_stream_writable.js:408:12)
at clearBuffer (_stream_writable.js:517:5)
at Socket.Writable.uncork (_stream_writable.js:314:7)
at connectionCorkNT (_http_outgoing.js:641:8)
at process._tickCallback (internal/process/next_tick.js:63:19)

what is the resolution?

The resolution is to use webpack-dev-server of version >= 3.1.7 that fixed the bug.
Based on github milestones in create-react-app it should be shipped with the updated version starting with create-react-app@2.0+ (PR react/create-react-app#5032)

Update webpack-dev-server 3.1.5 → 3.1.7 (react#4955)

Update webpack-dev-server 3.1.5 → 3.1.7 (#4955)

Navigation Menu

Repository navigation

Crash with "req.handle.writev is not a function" on Socket.Writable.uncork #21665

43 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Crash with "req.handle.writev is not a function" on Socket.Writable.uncork #21665

Description

Activity

gireeshpunathil commented on Jul 5, 2018

MymmiJ commented on Jul 11, 2018

Jesseppi commented on Jul 13, 2018

addaleax commented on Jul 13, 2018

WesSouza commented on Jul 14, 2018

danyim commented on Jul 15, 2018

YvanGuidoin commented on Jul 23, 2018

lundibundi commented on Jul 23, 2018

geminiyellow commented on Jul 25, 2018

WellspringCS commented on Jul 26, 2018

YvanGuidoin commented on Jul 26, 2018

addaleax commented on Jul 26, 2018

YvanGuidoin commented on Jul 27, 2018

addaleax commented on Jul 27, 2018

43 remaining items

rmatrose commented on Jan 22, 2019

nicholas-eden commented on Mar 5, 2019

addaleax commented on Mar 5, 2019

nicholas-eden commented on Mar 11, 2019

boxfox619 commented on Mar 18, 2019

martinKindall commented on Mar 20, 2019

alcmontejo commented on Oct 3, 2019

lundibundi commented on Feb 26, 2020

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions