typescript - ไม่สามารถทดสอบโค้ดใด ๆ ที่ใช้โมดูลของ openlayers ใน Jest

ฉันกำลังพยายามเขียนการทดสอบบางอย่างสำหรับโมดูลบางตัวที่บังเอิญนำเข้าโมดูล openlayers หนึ่งหรือสองโมดูล แต่ตามที่คนอื่นบางคนพบ (ที่นี่, ที่นี่, และที่นี่) สิ่งนี้ไม่ได้ผลทันที นี่คือสิ่งที่ฉันลองทำ:

• เปลี่ยนชื่อ .babelrc เป็น babel.config.js และส่งออกการตั้งค่า
• เพิ่ม transformIgnorePatterns ลงใน jest.config.js ของฉัน

ฉันแค่สับสนว่าจะทำอย่างไรถึงจะแก้ไขสิ่งนี้ได้ตอนนี้

ฉันกำลังใช้:

• การตั้งค่า webpack ที่ไม่ใช่ CRA
• Jest v23.6.0
• babel-core 6.26.3
• ไทป์สคริปต์ 3.1.3
• ts-jest 22.4.6

นี่คือการตั้งค่าของฉัน:

เจสต์ :

module.exports = {
  setupFiles: [
    "./testConfig/test-shim.js",
    "./testConfig/test-setup.js"
  ],
  transform: {
    "^.+\\.tsx?$": "ts-jest"
  },
  transformIgnorePatterns: [
    "/node_modules/(?!(ol)/).*/",
    "node_modules/(?!(ol)/)",
  ],
  testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx|tsx?)$",
  moduleNameMapper: {
    "^(Controllers|Api|Utilities)/(.*)$": "<rootDir>Scripts/$1/$2"
  },
  moduleFileExtensions: ["ts", "tsx", "js", "jsx", "json", "node"],
  coverageReporters: ["text", "text-summary", "html"],
  coverageDirectory: "testConfig/coverageReport",
  collectCoverageFrom: ["**/Scripts/{App,Controllers,Utilities,Localization,EntryPoints}/**/*.{ts,tsx}"],
  coverageThreshold: {
    global: {
      branches: 0,
      functions: 0,
      lines: 0,
      statements: 0
    }
  }
};

คำตอบ #1

ในที่สุดก็ทำให้มันใช้งานได้ ปัญหาคือโครงการนี้ใช้ TypeScript และตามปกติ นั่นทำให้ทุกอย่างซับซ้อนกว่าที่จำเป็น

เนื่องจากแหล่งข้อมูล OL จำเป็นต้องถูกรวบรวม และไฟล์เหล่านั้นเขียนด้วย JavaScript ฉันจึงจำเป็นต้องเพิ่มการแปลงอีกอันในค่ากำหนดของฉันเพื่อจัดการกับไฟล์เหล่านั้น หลังจากนั้นมันก็แสดงข้อผิดพลาดเกี่ยวกับ canvas ดังนั้นฉันจึงต้องติดตั้ง canvas mock ด้วยเช่นกัน

ดังนั้นส่วนที่ถูกแก้ไขของการตั้งค่าของฉันมีดังนี้:

  setupFiles: [
    "./testConfig/test-shim.js",
    "jest-canvas-mock", // <- the new mock
    "./testConfig/test-setup.js"
  ],
  transform: {
    "^.+\\.tsx?$": "ts-jest",
    "^.+\\.jsx?$": "babel-jest", // <- also compile js/x files
  },
  testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
  transformIgnorePatterns: [
    "node_modules/(?!(ol)/)", // <- exclude the OL lib
  ],

หวังว่านี่จะช่วยใครสักคนได้!