ক্রোম ১৪৯ বিটা

Rachel Andrew

প্রকাশিত: ৬ মে, ২০২৬

অন্যথায় উল্লেখ না থাকলে, নিম্নলিখিত পরিবর্তনগুলি Android, ChromeOS, Linux, macOS, এবং Windows-এর জন্য Chrome বিটা চ্যানেলের নতুনতম সংস্করণে প্রযোজ্য। এখানে তালিকাভুক্ত বৈশিষ্ট্যগুলি সম্পর্কে আরও জানতে প্রদত্ত লিঙ্কগুলি অথবা ChromeStatus.com-এর তালিকা দেখুন। ৬ই মে, ২০২৬ থেকে Chrome বিটা পর্যায়ে রয়েছে। আপনি ডেস্কটপের জন্য Google.com থেকে অথবা Android-এর জন্য Google Play Store থেকে সর্বশেষ সংস্করণটি ডাউনলোড করতে পারেন।

CSS এবং UI

টেবিলের জন্য সুস্পষ্ট বর্ডার কালার ইউএ স্টাইলশিট নিয়ম অপসারণ করুন

এই পরিবর্তনটি <table> এলিমেন্টের জন্য UA স্টাইলশিট থেকে ত্রুটিপূর্ণ border-color: gray CSS রুলটি সরিয়ে দেয়।

এইচটিএমএল স্পেসিফিকেশনে এই নিয়মটি নেই, এবং এর ফলে বর্ডারগুলো ভুলবশত ডিফল্টভাবে currentColor হয় না। ফায়ারফক্স বা ওয়েবকিট, কোনোটিরই ইউএ স্টাইলশিটে এই gray বর্ডার কালারের নিয়মটি নেই, যার ফলে আন্তঃকার্যক্ষমতার সমস্যা তৈরি হয়।

shape-outside এ path() এবং shape() সমর্থন করে

CSS-এর shape-outside প্রপার্টিতে path() এবং shape() শেপ ফাংশন ব্যবহারের সুবিধা যোগ করা হয়েছে। এই ফাংশনগুলো ডেভেলপারদের আয়তক্ষেত্রের স্থানাঙ্ক ব্যবহার করে ফ্লোট এক্সক্লুশন শেপ নির্ধারণ করতে সাহায্য করে।

shape-outside এ rect() এবং xywh() সমর্থন করুন

CSS-এর shape-outside প্রপার্টিতে rect() এবং xywh() বেসিক শেপ ফাংশনগুলোর জন্য সাপোর্ট যোগ করা হয়েছে। এই ফাংশনগুলো ডেভেলপারদের আয়তক্ষেত্রের স্থানাঙ্ক ব্যবহার করে ফ্লোট এক্সক্লুশন শেপ নির্ধারণ করার সুযোগ দেয়, যা ক্রোমকে ফায়ারফক্স এবং সাফারির সমান্তরালে নিয়ে আসে, কারণ তারা ইতিমধ্যেই এই ফিচারটি সমর্থন করে।

ওয়েব অ্যাপ স্কোপ সিস্টেমের অ্যাকসেন্ট রঙ

CSS কীওয়ার্ড এবং accent-color: auto এর জন্য সিস্টেম অ্যাকসেন্ট কালারের অ্যাক্সেস শুধুমাত্র একটি ওয়েব অ্যাপ এবং প্রাথমিক প্রোফাইল কনটেক্সটের মধ্যে সীমাবদ্ধ করে।

AccentColor এবং AccentColorText CSS কীওয়ার্ডগুলো যখন ওয়েবে ব্যবহারকারীর সিস্টেম কালার ব্যাপকভাবে প্রকাশ করে, তখন তা ফিঙ্গারপ্রিন্টিংয়ের একটি উল্লেখযোগ্য ঝুঁকি তৈরি করে। একারণে, এগুলো শুধুমাত্র ইনস্টল করা ওয়েব অ্যাপের মধ্যেই উপলব্ধ থাকে। এই ফিচারটি চালু হওয়ার সাথে সাথে accent-color: auto যুক্ত ফর্ম কন্ট্রোলগুলোও এই পরিধির অন্তর্ভুক্ত হয়েছে। এটি সিস্টেম কালারের ক্ষেত্রে ডেভেলপার এবং ব্যবহারকারীর প্রত্যাশাকে আরও সামঞ্জস্যপূর্ণ করে এবং AccentColor[Text] এর ফিঙ্গারপ্রিন্টিং সীমাবদ্ধতার সাথেও সঙ্গতিপূর্ণ হয়।

ব্যবহারকারীর ইন্টারঅ্যাকশনের সময় টেক্সট ওভারফ্লো ক্লিপ করুন।

যখন কোনো ব্যবহারকারী text-overflow: ellipsis সেট করা কোনো টেক্সটের সাথে ইন্টারঅ্যাক্ট করেন (যেমন সম্পাদনা বা ক্যারেট নেভিগেশন), তখন টেক্সটটি সাময়িকভাবে `ellipsis` থেকে `clip` অবস্থায় পরিবর্তিত হয়, যা ব্যবহারকারীকে লুকানো ওভারফ্লো কন্টেন্ট দেখতে এবং তার সাথে ইন্টারঅ্যাক্ট করতে দেয়। এই ফিচারটি সমস্ত সম্পাদনাযোগ্য এবং অসম্পাদনাযোগ্য এলিমেন্টের ক্ষেত্রে প্রযোজ্য। ফর্ম কন্ট্রোলগুলোর ( textarea , input ) জন্য এই আচরণটি ইতোমধ্যেই সমর্থিত।

CSS গ্যাপ ডেকোরেশন

সিএসএস গ্যাপ ডেকোরেশন আপনাকে গ্রিড এবং ফ্লেক্সবক্সের মতো কন্টেইনার লেআউটের ফাঁকা স্থানগুলোকে স্টাইল করার সুযোগ দেয়, যা একাধিক-কলাম লেআউটের column-rule মতোই কাজ করে। ওয়েব ডেভেলপারদের কাছে এই ফিচারটির ব্যাপক চাহিদা রয়েছে, কারণ বর্তমানে তাদের গ্রিড এবং ফ্লেক্সবক্স লেআউটের ফাঁকা স্থানগুলোকে স্টাইল করার জন্য বিভিন্ন কৌশল অবলম্বন করতে হয়।

image-rendering: crisp-edges

image-rendering: crisp-edges নির্দেশ করে যে ছবিটিকে এমনভাবে স্কেল করা উচিত যাতে এর কনট্রাস্ট এবং প্রান্তগুলি অক্ষুণ্ণ থাকে এবং এই প্রক্রিয়ায় রঙ মসৃণ হওয়া বা ছবিতে ব্লার তৈরি হওয়া এড়ানো যায়।

ব্যবহারকারীর ক্রিয়া ছদ্ম-শ্রেণী শীর্ষ স্তরের সীমানা

এই ফিচারটি CSS সিলেক্টর লেভেল 4 স্পেসিফিকেশনে বর্ণিত আচরণকে উপস্থাপন করে, যেখানে বলা হয়েছে যে :hover , :active , এবং :focus-within এলিমেন্টের প্যারেন্টদের সাথে ম্যাচ করে, কিন্তু শুধুমাত্র প্যারেন্ট চেইনের প্রথম টপ লেয়ার এলিমেন্ট পর্যন্ত। ক্রোমিয়ামের জন্য এই পরিবর্তনটি টপ লেয়ার এলিমেন্টগুলোর ক্ষেত্রে এই সীমাবদ্ধতাটি প্রয়োগ করে।

নির্দিষ্টভাবে বলতে গেলে, এর মানে হলো নিম্নলিখিত কাঠামোতে যদি ব্যবহারকারী <button> এর উপর মাউস নিয়ে যায়, তাহলে :hover সিউডো ক্লাসটি <button> এবং পপওভারের সাথে মিলবে, কিন্তু <main> এলিমেন্টের সাথে মিলবে না।

<main>
  <div popover>
    <button></button>
  </div>
</main>
<script>document.querySelector('[popover]').showPopover();</script>

এই পরিবর্তনের পেছনের যুক্তি হলো, সাধারণত টপ লেয়ার এলিমেন্টগুলো প্যারেন্ট এলিমেন্ট থেকে দৃশ্যত বিচ্ছিন্ন কোনো স্থানে রেন্ডার করা হয়। তাই, উদাহরণস্বরূপ, টপ লেয়ার এলিমেন্টের উপর হোভার করা হলে বা এটিকে সক্রিয় করা হলে প্যারেন্ট এলিমেন্টের স্টাইল পরিবর্তন করার কোনো মানে হয় না।

ক্রোমিয়ামে অন্তর্ভুক্ত কাস্টমাইজযোগ্য সিলেক্ট ইমপ্লিমেন্টেশনে `select ::picker() পপওভারের নির্দিষ্ট ক্ষেত্রের জন্য এই লজিকটি হার্ড-কোড করা আছে। এই ফিচারের আরও সাধারণ আচরণের স্বার্থে সেই বিশেষ ক্ষেত্রের লজিকটি সরিয়ে ফেলা হচ্ছে।

CSS প্রপার্টি হিসেবে path-length সমর্থন করুন

এই পরিবর্তনের মাধ্যমে path-length নামে একটি নতুন CSS প্রপার্টি চালু করা হয়েছে, যা বিদ্যমান SVG pathLength প্রেজেন্টেশন অ্যাট্রিবিউটের সাথে ম্যাপ করা হয়েছে। এটি সেইসব SVG জিওমেট্রি এলিমেন্টের ক্ষেত্রে প্রযোজ্য যেগুলো pathLength সাপোর্ট করে (যেমন <path> , <circle> , <rect> , <line> , <polyline> , <polygon> , এবং <ellipse> )।

pathLength একটি CSS প্রপার্টি হিসেবে প্রকাশ করার ফলে ডেভেলপাররা এটিকে স্টাইলশিট, ইনলাইন স্টাইল এবং অ্যানিমেশনে নির্দিষ্ট করতে পারেন, যার ফলে এটি সাধারণ CSS ক্যাসকেডিং, স্পেসিফিসিটি, ট্রানজিশন এবং অ্যানিমেশনে অংশগ্রহণ করতে পারে। এই প্রপার্টিটি মোট পাথের দৈর্ঘ্যের উপর নির্ভরশীল সমস্ত গণনাকে প্রভাবিত করে, যার মধ্যে স্ট্রোক ড্যাশ রেন্ডারিং এবং একটি <textPath> বরাবর টেক্সটের অবস্থান নির্ধারণ অন্তর্ভুক্ত।

সিএসএস ডিক্লারেশনগুলো স্ট্যান্ডার্ড সিএসএস প্রেসিডেন্স নিয়ম অনুসরণ করে প্রেজেন্টেশন অ্যাট্রিবিউটকে ওভাররাইড করে। path-length -এর প্রাথমিক মান হলো none , যা লেখকের দেওয়া পাথ লেংথের অনুপস্থিতি বোঝায় এবং এটি 0 মতো কোনো সুস্পষ্ট সাংখ্যিক মান থেকে আলাদা।

ফিচারটি নিষ্ক্রিয় করা হলেও বিদ্যমান অ্যাট্রিবিউট-ভিত্তিক আচরণ সংরক্ষিত থাকে।

ওয়েব এপিআই

Intl.Locale.prototype.variants

TC39 প্রস্তাবনায় উল্লিখিত অনুযায়ী Intl.Locale.prototype.variants যোগ করুন এবং TC39 ল্যাঙ্গুয়েজ আইডি আপডেটের মতো Intl.Locale কনস্ট্রাক্টরের অপশন ব্যাগে "variants" গ্রহণ করুন। ECMA402-এর পরিবর্তনগুলো পুল রিকোয়েস্ট 960 -এ মার্জ করা হয়েছে এবং test262-এর টেস্ট কোড পুল রিকোয়েস্ট 4474- এ মার্জ করা হয়েছে।

প্রোগ্রাম্যাটিক স্ক্রোল প্রতিশ্রুতি

ওয়েব ডেভেলপারদের কাছে বর্তমানে এটা জানার কোনো উপায় নেই যে কখন একটি প্রোগ্রাম্যাটিক স্মুথ-স্ক্রোল সম্পন্ন হয়েছে। এই ফিচারটি এই সমস্যার একটি সমাধান প্রদান করে: প্রোগ্রাম্যাটিক স্ক্রোল মেথডগুলোকে এমন প্রমিস (Promise) অবজেক্ট রিটার্ন করানো, যা স্ক্রোল সম্পন্ন হওয়ার পর ইন্টারাপশন স্ট্যাটাস সহ রিজলভ (resolve) হয়।

পেমেন্ট অনুরোধ: পেমেন্ট হ্যান্ডলারদের অভ্যন্তরীণ ত্রুটি রিপোর্ট করার অনুমতি দিন

পেমেন্ট রিকোয়েস্ট এপিআই (Payment Request API) দ্বারা অ্যাক্সেস করা পেমেন্ট হ্যান্ডলারগুলোকে "ব্যবহারকারী বাতিল করেছেন" এবং "পেমেন্ট অ্যাপের অভ্যন্তরীণ ত্রুটি"-র জন্য আলাদা ত্রুটি ফেরত দেওয়ার সুবিধা দেয়। এর ফলে ওয়েব ডেভেলপাররা ব্যবহারকারীদের জন্য আরও উন্নত ফ্লো তৈরি করতে পারেন; যেমন, অ্যাপের অভ্যন্তরীণ ত্রুটি ঘটলে পুনরায় চেষ্টা করা বা অন্য কোনো ফ্লো-তে ফিরে যাওয়া, এবং ব্যবহারকারী বাতিল করতে চাইলে ফ্লো-টি যথাযথভাবে থামিয়ে দেওয়া।

PaymentRequestEvent.respondWith এ পাঠানো প্রমিসটি রিজেক্ট করার জন্য কোন এরর ব্যবহার করা হচ্ছে, তার উপর ভিত্তি করে ওয়েব-ভিত্তিক পেমেন্ট হ্যান্ডলার এপিআই এই পার্থক্যটি নির্দেশ করতে পারে। যদি প্রমিসটি OperationError দিয়ে রিজেক্ট করা হয়, তাহলে PaymentRequest.show() মেথড ব্যবহার করে মার্চেন্টের কাছে "অভ্যন্তরীণ অ্যাপ এরর" ( OperationError ) রিটার্ন করা হয়, অন্যথায় "ব্যবহারকারীর বাতিল" ( AbortError ) রিটার্ন করা হয়।

নেটিভ অ্যাপ পেমেন্ট হ্যান্ডলার পরিকাঠামোও একইভাবে আপডেট করা হয়েছে, কিন্তু এটি ওয়েব এপিআই-এর আওতার বাইরে।

TSF-এ উইন্ডোজ টাচ কীবোর্ডের জন্য autocorrect="off" কে সম্মান করুন।

এইচটিএমএল autocorrect অ্যাট্রিবিউট ওয়েব লেখকদের নিয়ন্ত্রণ করতে দেয় যে <input> , <textarea> , এবং contenteditable হোস্ট-এর মতো সম্পাদনাযোগ্য এলিমেন্টগুলিতে ব্যবহারকারীর ইনপুটের উপর অটোকারেকশন প্রয়োগ করা হবে কি না। উইন্ডোজে, টাচ কিবোর্ড এই অ্যাট্রিবিউটটিকে উপেক্ষা করে এবং সর্বদা শব্দগুলিকে অটোকারেক্ট করে। উদাহরণস্বরূপ, autocorrect="off" সেট করা কোনো এলিমেন্টে "truf" টাইপ করে স্পেস দিলে, " "truf " অপরিবর্তিত থাকার পরিবর্তে "true " আসে। এই বৈশিষ্ট্যটির কারণে, যখন ফোকাস করা সম্পাদনাযোগ্য এলিমেন্টটিতে autocorrect="off" সেট করা থাকে, তখন ক্রোমের TSF ইন্টিগ্রেশন টাচ কিবোর্ডের অটোকারেকশন শনাক্ত করে এবং পূর্বাবস্থায় ফিরিয়ে আনে।

bfcache এন্ট্রিতে WebSockets সংযোগ বিচ্ছিন্ন করুন

সক্রিয় ওয়েব সকেট সংযোগগুলো এখন আর কোনো পৃষ্ঠাকে ব্যাক/ফরোয়ার্ড ক্যাশে (bfcache) প্রবেশ করতে বাধা দেয় না। ডকুমেন্টটিকে অযোগ্য হিসেবে চিহ্নিত করার পরিবর্তে bfcache-এ প্রবেশের সময় সংযোগগুলো বন্ধ করে দেওয়ার মাধ্যমে, ব্রাউজার সক্রিয় ওয়েব সকেটযুক্ত পৃষ্ঠাগুলোকে সংরক্ষণ ও পুনরুদ্ধার করার অনুমতি দেয়।

Request.isReloadNavigation অ্যাট্রিবিউট

Fetch API-এর Request ইন্টারফেসে isReloadNavigation একটি রিড-অনলি বুলিয়ান অ্যাট্রিবিউট যোগ করে। এই অ্যাট্রিবিউটটি নির্দেশ করে যে বর্তমান নেভিগেশন অনুরোধটি ব্যবহারকারী-চালিত রিলোড হিসাবে শুরু হয়েছিল কিনা (উদাহরণস্বরূপ, রিফ্রেশ বোতাম, location.reload() , বা history.go(0) ব্যবহার করে)। এই সিগন্যালটি মূলত একটি Service Worker-এর FetchEvent মধ্যে Request অবজেক্টে প্রকাশ করা হয়।

প্লাগইন এবং ক্রস-অরিজিন ও সীমাবদ্ধ আইফ্রেমগুলিতে SVG ফিল্টার নিষ্ক্রিয় করুন

এই লঞ্চটি ক্রস-অরিজিন বা সীমাবদ্ধ আইফ্রেম (যেমন, স্যান্ডবক্সড আইফ্রেম) এবং এমবেডেড প্লাগইন (যেমন, পিডিএফ)-এ SVG ফিল্টার প্রয়োগ হওয়া প্রতিরোধ করে। যখন কোনো ফ্রেম বা প্লাগইনকে একটি SVG ফিল্টার ইফেক্ট দিয়ে পেইন্ট করার কথা আসে, তখন ইফেক্ট ট্রি-টি ট্র্যাভার্স করে SVG ফিল্টারবিহীন সর্বোচ্চ পূর্বপুরুষকে খুঁজে বের করা হয় এবং তার পরিবর্তে সেই ইফেক্টটি প্রয়োগ করা হয়।

নতুন উৎস পরীক্ষা

ক্রোম ১৪৯-এ আপনি নিম্নলিখিত নতুন অরিজিন ট্রায়ালগুলিতে অংশগ্রহণ করতে পারেন।

অনুমতি নীতি: ব্যবহারকারীর সক্রিয়করণ ছাড়া ফোকাস

focus-without-user-activation ’ পারমিশন পলিসির মাধ্যমে এমবেডারদেরকে এমবেড করা কন্টেন্ট থেকে প্রোগ্রাম্যাটিক ফোকাসের উপর নিয়ন্ত্রণ দেয়। যখন কোনো ফ্রেমের জন্য এই পলিসিটি বাতিল করা হয়, তখন ব্যবহারকারীর অ্যাক্টিভেশন দ্বারা ট্রিগার না হওয়া পর্যন্ত প্রোগ্রাম্যাটিক ফোকাস কলগুলো ( element.focus() , autofocus , window.focus() , dialog.showModal() , এবং পপওভার ফোকাসিং) ব্লক হয়ে যায়। ক্লিক করা বা ট্যাব চাপার মতো ব্যবহারকারী-প্রবর্তিত ফোকাস এর উপর কখনও প্রভাব ফেলে না।

পলিসিটি একটি Permissions-Policy HTTP রেসপন্স হেডার অথবা iframe allow অ্যাট্রিবিউট ব্যবহার করে সেট করা যেতে পারে। ফোকাস ডেলিগেশন সমর্থিত: ফোকাস থাকা একটি প্যারেন্ট ফ্রেম প্রোগ্রাম্যাটিকভাবে একটি চাইল্ড iframe-এ ফোকাস পাস করতে পারে, এমনকি যদি চাইল্ড iframe-টির জন্য পলিসিটি ডিনাইড করা থাকে, এবং একবার কোনো ফ্রেম ফোকাস পেলে সেটি তার নিজের সাবট্রি-র মধ্যেই ফোকাস স্থানান্তর করতে পারে।

গেমপ্যাড ইভেন্ট-চালিত ইনপুট এপিআই

এই প্রস্তাবটি একটি নতুন ইভেন্ট-চালিত মডেলের মাধ্যমে গেমপ্যাড এপিআই-কে প্রসারিত করে, যা অ্যাপ্লিকেশনগুলিকে কম ল্যাটেন্সিতে গেমপ্যাড ইনপুট গ্রহণ করতে সক্ষম করে। navigator.getGamepads() ব্যবহার করে ঘন ঘন পোলিংয়ের উপর নির্ভর করার পরিবর্তে, ডেভেলপাররা এখন একটি rawgamepadinputchange ইভেন্টের জন্য লিসেন করতে পারেন, যা ডিভাইস থেকে নতুন ইনপুট ডেটা উপলব্ধ হলেই ফায়ার হয়। এটি আরও দ্রুত ইনপুট হ্যান্ডলিংয়ের সুযোগ করে দেয়, বিশেষ করে ল্যাটেন্সি-সংবেদনশীল অ্যাপ্লিকেশনগুলিতে।

ওয়েবঅ্যাসেম্বলি কাস্টম বর্ণনাকারী

এটি ওয়েবঅ্যাসেম্বলিকে সোর্স-লেভেল টাইপের সাথে যুক্ত ডেটা নতুন কাস্টম ডেসক্রিপ্টর অবজেক্টে আরও দক্ষতার সাথে সংরক্ষণ করতে সাহায্য করে। এই কাস্টম ডেসক্রিপ্টরগুলোকে সেই সোর্স-লেভেল টাইপের ওয়েবঅ্যাসেম্বলি অবজেক্টের প্রোটোটাইপ দিয়ে কনফিগার করা যায়। এর ফলে একটি ওয়েবঅ্যাসেম্বলি অবজেক্টের প্রোটোটাইপ চেইনে মেথড ইনস্টল করা যায় এবং সাধারণ মেথড কল সিনট্যাক্স ব্যবহার করে জাভাস্ক্রিপ্ট থেকে সরাসরি কল করা যায়। একটি ইম্পোর্ট করা বিল্টইন ফাংশন ব্যবহার করে প্রোটোটাইপ এবং মেথডগুলোকে ডিক্লারেটিভভাবে কনফিগার করা যায়।