web-dev-qa-db-ja.com

jsdomとtypescriptを使用して、「プロパティ '...'がタイプ 'Global'に存在しない」を防ぐ方法は?

TypeScriptを使用するように既存のプロジェクトを変換しようとしましたが、テストのセットアップで問題が発生しました。

テスト中にすべてのDOM相互作用コードが機能するように、jsdomをセットアップするテスト用のセットアップファイルがありました。 TypeScript(ts-node with mocha)を使用すると、常に次のようなエラーが表示されます。

Property 'window' does not exist on type 'Global'.

これを防ぐために、次のようにNodeJS.Globalインターフェイスにパッチを適用しました。

declare namespace NodeJS{
  interface Global {
    document: Document;
    window: Window;
    navigator: Navigator;
  }
}

しかし、これは何も変わりませんでした。

NodeJSグローバル変数でこれらのブラウザープロパティを有効にするにはどうすればよいですか?

追加:

これは私のモカですsetup.ts

import { jsdom, changeURL } from 'jsdom';

const exposedProperties = ['window', 'navigator', 'document'];

global.document = jsdom('');
global.window = global.document.defaultView;
Object.keys(global.document.defaultView).forEach((property) => {
  if (typeof global[property] === 'undefined') {
    exposedProperties.Push(property);
    global[property] = global.document.defaultView[property];
  }
});

global.navigator = {
  userAgent: 'node.js',
};

changeURL(global.window, 'http://example.com/');
30
fahrradflucht

エラーを回避するための元の回答

これをTypeScriptファイルの先頭に置きます

const globalAny:any = global;

次に、代わりにglobalAnyを使用します。

globalAny.document = jsdom('');
globalAny.window = global.document.defaultView;

型安全性を維持するための回答を更新

型の安全性を維持したい場合は、既存のNodeJS.Global型定義を拡張できます。

グローバルスコープdeclare global {...}内に定義を配置する必要があります

TypeScript globalスコープはNodeJSインターフェースGlobal、またはglobal型のGlobalと呼ばれるノードglobal propertyと同じではないことに注意してください...

declare global {
  namespace NodeJS {
    interface Global {
       document: Document;
       window: Window;
       navigator: Navigator;
  }
}
44
Steven Spungin

他の回答に加えて、割り当てサイトで直接 castglobalを使用することもできます。

(global as any).myvar = myvar;
20
lleaff

これを行うことでこの問題を修正しました...

export interface Global {
  document: Document;
  window: Window;
}

declare var global: Global;
11
Shawn

型キャストanyを避け、型付けの目的を取り除きます。代わりに、必要なタイプ定義をインストールします(例:yarn add --dev @types/jsdom @types/node)および使用するインポート:

import { DOMWindow, JSDOM } from 'jsdom'

interface Global extends NodeJS.Global {
  window: DOMWindow,
  document: Document,
  navigator: {
    userAgent: string
  }
}

const globalNode: Global = {
  window: window,
  document: window.document,
  navigator: {
    userAgent: 'node.js',
  },
  ...global
}
3
willsquire
declare namespace NodeJS {
  export interface Global { window: any;
  }
}
3