কর্ম ইউনিট পরীক্ষার সময় চিত্রগুলির জন্য কীভাবে 404 সতর্কতাগুলি স্থির করবেন


84

আমি গ্রান্ট / কর্ম / ফ্যান্টমজ / জুঁই ব্যবহার করে আমার এক নির্দেশকের (কৌণিকতা) পরীক্ষা করছি। আমার পরীক্ষা ভাল চলছে

describe('bar foo', function () {
    beforeEach(inject(function ($rootScope, $compile) {
        elm = angular.element('<img bar-foo src="img1.png"/>');
        scope = $rootScope.$new();
        $compile(elm)();
        scope.$digest();
    }));
    ....
});

তবে আমি এই 404 গুলি পেয়েছি

WARN [web-server]: 404: /img1.png
WARN [web-server]: 404: /img2.png
...

যদিও তারা কিছুই না করে, তারা লগ আউটপুটটিতে শব্দ যোগ করে। এই সমাধানের জন্য একটি উপায় আছে কি ? (অবশ্যই কর্মের লগ লেভেল পরিবর্তন না করে, কারণ আমি তাদের দেখতে চাই না)


এটি কি অন্য একটি ব্রাউজারে স্থির থাকে? আমি জানি এফএফ-তে এই ধরণের কলগুলির জন্য 404 ত্রুটিযুক্ত কিছু জ্ঞাত সমস্যা রয়েছে।
নিকোলাস হ্যাজেল

এটি ফ্যানটমজ হতে হবে। আমি ক্রোমটি পরীক্ষা করেছি যা 404 টিও দেখায়। লক্ষ্য করুন যে তারা সতর্কতা, ত্রুটি নয়!
Jeanluca Scaljeri

এনজি-এসসিআর ব্যবহার করে সাহায্য করে?
ইটন পিয়ার

চমৎকার চেষ্টা করুন, তবে একই ফলাফল রয়েছে
জিনলুকা স্কালজেরি

উত্তর:


109

এটি কারণ আপনাকে লোড করার জন্য কর্মটি কনফিগার করতে হবে যখন অনুরোধ করা হবে তখন সেগুলি পরিবেশন করুন;)

আপনার karma.conf.js ফাইলে আপনার ইতিমধ্যে সংজ্ঞায়িত ফাইল এবং / অথবা নিদর্শনগুলি থাকা উচিত:

// list of files / patterns to load in the browser
files : [
  {pattern: 'app/lib/angular.js', watched: true, included: true, served: true},
  {pattern: 'app/lib/angular-*.js', watched: true, included: true, served: true},
  {pattern: 'app/lib/**/*.js', watched: true, included: true, served: true},
  {pattern: 'app/js/**/*.js', watched: true, included: true, served: true},
  // add the line below with the correct path pattern for your case
  {pattern: 'path/to/**/*.png', watched: false, included: false, served: true},
  // important: notice that "included" must be false to avoid errors
  // otherwise Karma will include them as scripts
  {pattern: 'test/lib/**/*.js', watched: true, included: true, served: true},
  {pattern: 'test/unit/**/*.js', watched: true, included: true, served: true},
],

// list of files to exclude
exclude: [

],

// ...

আরও তথ্যের জন্য আপনি এখানে একবার দেখতে পারেন :)

সম্পাদনা: আপনি যদি নিজের অ্যাপ্লিকেশনটি চালানোর জন্য কোনও নোডেজ ওয়েব-সার্ভার ব্যবহার করেন তবে আপনি এটি karma.conf.js এ যুক্ত করতে পারেন:

proxies: {
  '/path/to/img/': 'http://localhost:8000/path/to/img/'
},

সম্পাদনা 2: আপনি যদি অন্য সার্ভারটি ব্যবহার না করেন বা ব্যবহার করতে চান তবে আপনি একটি স্থানীয় প্রক্সি সংজ্ঞায়িত করতে পারেন তবে কর্মফল ব্যবহারের বন্দরটিতে অ্যাক্সেস সরবরাহ না করে, গতিশীলভাবে, যদি কর্ম 9879 (ডিফল্ট) এর চেয়ে অন্য কোনও বন্দরে শুরু হয়, আপনি এখনও যারা বিরক্তিকর 404 পেতে ...

proxies =  {
  '/images/': '/base/images/'
};

সম্পর্কিত সমস্যা: https://github.com/karma-runner/karma/issues/872


4
আমার ক্ষেত্রে এই চিত্রগুলির অস্তিত্ব নেই। আপনার প্রদত্ত সমাধানটি ফাইলগুলি উপস্থিত রয়েছে, তাই না?
জিনলুকা স্কালজেরি

হ্যা অবশ্যই! আমার মনে হয় আমি ভুল বুঝেছি, অস্তিত্বহীন ফাইলগুলির জন্য 404 ত্রুটি রয়েছে তা বোঝা যায়, তাই না? আপনি কি চিত্র সম্পর্কিত সতর্কতাগুলি আড়াল করতে চান? লগ স্তর পরিবর্তন না করে, আমি কোনও সমাধান দেখতে পাচ্ছি না, তদুপরি, এটি অন্যান্য সতর্কতাগুলি লুকিয়ে রাখবে, যা ঝুঁকিপূর্ণ হবে। উদাহরণস্বরূপ "টেস্ট / img" ফোল্ডারে খালি .png ফাইল তৈরি করবেন না কেন? :)
gle ব্যাখ্যাre

কিছু কারণে আমি এটি কাজ করতে পারি না। এইচটিএমএলতে ব্যবহৃত ইউআরএল এবং কার্মা.কন.ফ.জেসের প্যাটার্নের মধ্যে ঠিক কী সম্পর্ক রয়েছে? উদাহরণস্বরূপ, যদি আমার পরীক্ষা / সম্পদ / img.png এ একটি চিত্র থাকে তবে ইউআরএলটি কী হওয়া উচিত?
Jeanluca Scaljeri

4
আমার ক্ষমা, এই সমাধানটি কাজ করা উচিত তবে আমি 404 ত্রুটিও পেতে থাকি getting আমি বিশ্বাস করি এটি কর্মের বাস্তবায়নের অভাবের সাথে সম্পর্কিত এবং আমি অবাক হয়েছি যে এটির জন্য আমরাই একমাত্র। এটি কাজ করার জন্য আমি একটি (বিট হ্যাকি) উপায় খুঁজে পেয়েছি তবে আপনাকে কর্মের সমান্তরালে অন্য একটি (ওয়েব) সার্ভার চালানো দরকার। আমি আমার উত্তর সম্পাদনা করব। ;)
গ্লেলিটারে

4
EDIT2 এর প্রতিক্রিয়া হিসাবে আপনি যদি একটি কাস্টম পোর্টে কর্ম পরিচালনা করেন তবে আপনি কর্ম সার্ভারের সম্পূর্ণ ইউআরআইয়ের সাথে সংযোগ স্থাপন করে 404s এড়াতে পারবেন: (ধরে নিচ্ছেন port: 9999)proxies = { '/images/': 'http://localhost:9999/base/images/' };
জোশ

18

আমার জন্য ধাঁধার বিভ্রান্তিকর অংশটি ছিল 'বেস' ভার্চুয়াল ফোল্ডার। আপনি যদি জানেন না যে আপনার ফিক্সারের সম্পদ পথে অন্তর্ভুক্ত করা দরকার তবে আপনাকে ডিবাগ করা কঠিন হবে।

হিসাবে কনফিগারেশন ডকুমেন্টেশন অনুযায়ী

ডিফল্টরূপে সমস্ত সম্পদ http: // লোকালহোস্টে সরবরাহ করা হয়: [পোর্ট] / বেস /

দ্রষ্টব্য: এটি অন্যান্য সংস্করণগুলির ক্ষেত্রে সত্য নাও হতে পারে - আমি 0.12.14 এ আছি এবং এটি আমার পক্ষে কাজ করেছে তবে 0.10 ডক্স এটি উল্লেখ করে না।

ফাইলের প্যাটার্ন নির্দিষ্ট করার পরে:

{ pattern: 'Test/images/*.gif', watched: false, included: false, served: true, nocache: false },

আমি আমার দৃ my়তা মধ্যে এটি ব্যবহার করতে পারে:

<img src="base/Test/images/myimage.gif" />

এবং এই মুহুর্তে আমার প্রক্সিটির দরকার নেই।


এই ক্লিঞ্জার। শীর্ষ উত্তরটি এটি ব্যাখ্যা করে তবে খুব সংক্ষেপে - প্রসারণের জন্য ধন্যবাদ।
জেএলবি

10

আপনি আপনার karma.conf.js এর মধ্যে জেনেরিক মিডলওয়্যার তৈরি করতে পারেন - উপরে কিছুটা হলেও আমার কাজটি করেছেন

প্রথমে ডামি 1px চিত্রগুলি সংজ্ঞায়িত করুন (আমি বেস 64 ব্যবহার করেছি):

const DUMMIES = {
  png: {
    base64: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg==',
    type: 'image/png'
  },
  jpg: {
    base64: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAABAAEDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD3+iiigD//2Q==',
    type: 'image/jpeg'
  },
  gif: {
    base64: 'data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=',
    type: 'image/gif'
  }
};

তারপরে মিডলওয়্যার ফাংশনটি সংজ্ঞায়িত করুন:

function surpassImage404sMiddleware(req, res, next) {
  const imageExt = req.url.split('.').pop();
  const dummy = DUMMIES[imageExt];

  if (dummy) {
    // Table of files to ignore
    const imgPaths = ['/another-cat-image.png'];
    const isFakeImage = imgPaths.indexOf(req.url) !== -1;

    // URL to ignore
    const isCMSImage = req.url.indexOf('/cms/images/') !== -1;

    if (isFakeImage || isCMSImage) {
      const img = Buffer.from(dummy.base64, 'base64');
      res.writeHead(200, {
        'Content-Type': dummy.type,
        'Content-Length': img.length
      });
      return res.end(img);
    }
  }
  next();
}

আপনার কর্মফল এ মিডলওয়্যার প্রয়োগ করুন

{
    basePath: '',
    frameworks: ['jasmine', '@angular/cli'],
    middleware: ['surpassImage404sMiddleware'],
    plugins: [
      ...
      {'middleware:surpassImage404sMiddleware': ['value', surpassImage404sMiddleware]}
    ],
    ...
}

আপনি কি কখনও এটি একটি আসল প্যাকেজ তৈরি করেছেন? আমি
এইটি

আপনি যদি সমস্ত চিত্রের অনুরোধগুলি দমন করতে চান req.headers.acceptতবে কেবল এটিতে রয়েছে কিনা তা পরীক্ষা করে দেখুন imageএবং যদি তা 204 ফেরত দেয় তবে।
21

9

@ গ্লেপিটারের উত্তরের ভিত্তিতে, আমি একটি খালি .png ফাইল তৈরি করেছি এবং এটি 404 সতর্কতাগুলি গোপন করার জন্য কনফিগারেশনে যুক্ত করেছি:

proxies: {
  '/img/generic.png': 'test/assets/img/generic.png'
}

3

ঠিক করার জন্য, karma.conf.jsআপনার প্রক্সিগুলির সাথে পরিবেশন করা ফাইলটি নির্দেশ করতে ভুলবেন না:

files: [
  { pattern: './src/img/fake.jpg', watched: false, included: false, served: true },
],
proxies: {
  '/image.jpg': '/base/src/img/fake.jpg',
  '/fake-avatar': '/base/src/img/fake.jpg',
  '/folder/0x500.jpg': '/base/src/img/fake.jpg',
  '/undefined': '/base/src/img/fake.jpg'
}

3

যদিও এটি একটি পুরানো থ্রেড, আমার ছবিটি সত্যই 404 মুছে ফেলার জন্য কর্ম থেকে পরিবেশন করতে পেতে আমার কয়েক ঘন্টা সময় লেগেছে comments মন্তব্যগুলি যথেষ্ট পর্যাপ্ত ছিল না। আমি বিশ্বাস করি আমি এই স্ক্রিনশটটি দিয়ে সমাধানটি পরিষ্কার করতে পারি। মূলত একটি জিনিস যা অনেক মন্তব্য অনুপস্থিত ছিল তা হ'ল প্রক্সি মানটি "/ বেস" দিয়ে শুরু হওয়া উচিত , যদিও বেসটি আমার কোনও ফোল্ডারের পথে নয়, এটি আমার অনুরোধগুলিতেও নয়।

("বেস" ফরোয়ার্ড স্ল্যাশ ছাড়াই কর্মের 400 বিএডি অনুরোধ ফিরে আসার ফলে)

এখন এনজি টেস্ট চালানোর পরে , আমি সফলভাবে "./src/assets/favicon.png" url থেকে পোস্ট করতে পারি: http: // লোকালহস্ত: 9876 / পরীক্ষা / ডামি.পিএনজি

আমার প্রকল্পে আমি নিম্নলিখিত এনপিএম প্যাকেজ সংস্করণগুলি ব্যবহার করছি:

  • কর্ম v4.3.0
  • জুঁই-কোর v3.2.1
  • কর্ম-জুঁই v1.1.2
  • @ কৌণিক / ক্লিপ ভি 8.3.5
  • কৌণিক v8.2.7

Karma.conf.js সম্পদের অবস্থানগুলির সাথে ভিএসকোড প্রকল্পের কাঠামো


এই অন্তর্দৃষ্টিটি বুঝতে আমার পক্ষে বিশেষভাবে সহায়ক ছিল যে বেস অঞ্চলের মধ্যে ফাইলগুলি পরিবেশন করার জন্য এবং কর্মক্ষেত্রের দিক থেকে (কর্মের দৃষ্টিকোণ থেকে) একটি পার্থক্য রয়েছে (যা শেষ পর্যন্ত আমার সমস্যা ছিল), যা আমাকে github.com / কর্মমার দিকে নিয়ে গিয়েছিল -রুনার / কর্ম / ইস্যু / 2703 । সুতরাং, এই স্পষ্টির জন্য আপনাকে ধন্যবাদ।
dpmott

2

আপনার কনফিগারেশন ফাইলের কোথাও রুট পাথ থাকলে আপনি এর মতো কিছু ব্যবহার করতে পারেন:

proxies: {
  '/bower_components/': config.root + '/client/bower_components/'
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.