关闭按钮逻辑优化

src/components/site/SiteDialogs.tsx

@@ -49,8 +49,8 @@ export function SiteDialogs() {
 </div>
 </div>
 </div>
-<button className={"startup-close"} type={"button"} aria-label={"离开网站"}>
-<img src={"/assets/189d7323288bd44d.svg"} width={"36"} height={"36"} alt={"离开网站"} aria-hidden={"true"} />
+<button className={"startup-close"} type={"button"} aria-label={"关闭并进入网站"}>
+<img src={"/assets/189d7323288bd44d.svg"} width={"36"} height={"36"} alt={"关闭并进入网站"} aria-hidden={"true"} />
 </button>
 </dialog>
 <dialog id={"startup-ad"} className={"startup-popup"} aria-label={"广告推荐"}>

src/lib/client/startup.ts

@@ -276,7 +276,9 @@ export function startStartupDialogs(): StartupDialogs {
   const startup = new StartupDialogs(storage, view, document.documentElement.classList.contains('eighteen-ok'));
   age.addEventListener('cancel', event => event.preventDefault());
   age.querySelector('.startup-age-confirm')!.addEventListener('click', () => startup.confirmAge());
-  age.querySelectorAll('.startup-age-leave,.startup-close').forEach(button => button.addEventListener('click', () => location.assign('https://www.google.com')));
+  age.querySelectorAll('.startup-age-leave').forEach(button => button.addEventListener('click', () => location.assign('https://www.google.com')));
+  // The close button (X) under the age dialog enters the site, like the confirm button.
+  age.querySelector('.startup-close')?.addEventListener('click', () => startup.confirmAge());
   function nextAdvertisement() {startup.nextAdvertisement();}
   close.addEventListener('click', nextAdvertisement);
   ad.addEventListener('cancel', event => {event.preventDefault(); nextAdvertisement();});

tests/startup.test.mjs

@@ -218,17 +218,17 @@ test('image loading supports cached images, errors, timeouts and cancellation',a
   }finally{if(previous===undefined)delete globalThis.window;else globalThis.window=previous;}
 });
 
-test('dialog controls enforce age confirmation, advance ads on Escape, emit no tracking events, and use the reference exit',async()=>{
+test('dialog controls enforce age confirmation (the X also enters the site), advance ads on Escape, emit no tracking events, and keep the explicit exit',async()=>{
   class Dialog extends FakeElement {
     open=false;nodes=new Map();
     showModal(){this.open=true;}
     close(){this.open=false;}
     querySelector(selector){return this.nodes.get(selector);}
-    querySelectorAll(){return [exit,ageClose];}
+    querySelectorAll(){return [exit];}
   }
   const age=new Dialog(),popup=new Dialog(),grid=new Dialog();
   const enter=new FakeElement(),exit=new FakeElement(),ageClose=new FakeElement(),close=new FakeElement(),media=new FakeElement(),loading=new FakeElement(),image=new FakeImage(),promotions=new FakeElement(),gridClose=new FakeElement();
-  age.nodes.set('.startup-age-confirm',enter);
+  age.nodes.set('.startup-age-confirm',enter);age.nodes.set('.startup-close',ageClose);
   popup.nodes.set('.startup-ad-image',image);popup.nodes.set('.startup-ad-media',media);popup.nodes.set('.startup-ad-loading',loading);popup.nodes.set('.startup-close',close);
   grid.nodes.set('.startup-promotions',promotions);grid.nodes.set('.startup-close',gridClose);
   const doc=new EventTarget(),classes=new Set();const store=session(),exits=[],tracks=[];
@@ -243,7 +243,7 @@ test('dialog controls enforce age confirmation, advance ads on Escape, emit no t
     const controller=startStartupDialogs();controller.setAdvertisements(ads,[ad('app')]);await flush();
     assert.equal(age.open,true);assert.equal(popup.open,false);
     const cancelAge=new Event('cancel',{cancelable:true});age.dispatchEvent(cancelAge);assert.equal(cancelAge.defaultPrevented,true);assert.equal(age.open,true);
-    enter.click();assert.equal(age.open,false);assert.equal(popup.open,true);assert.equal(media.href,'https://example.com/first');assert.equal(store.getItem('hg_age_ok'),'1');
+    ageClose.click();assert.equal(age.open,false);assert.deepEqual(exits,[],'the X never leaves the site');assert.equal(popup.open,true);assert.equal(media.href,'https://example.com/first');assert.equal(store.getItem('hg_age_ok'),'1');
     media.click();assert.equal(popup.open,true);
     const cancelAd=new Event('cancel',{cancelable:true});popup.dispatchEvent(cancelAd);await flush();
     assert.equal(cancelAd.defaultPrevented,true);assert.equal(media.href,'https://example.com/second');assert.equal(popup.open,true);
@@ -273,6 +273,6 @@ test('dialog controls enforce age confirmation, advance ads on Escape, emit no t
     assert.equal(promotions.children[1].href,'https://example.com/last');
     const inertClick=new Event('click');Object.defineProperty(inertClick,'target',{value:noLink.children[0]});promotions.dispatchEvent(inertClick);assert.equal(grid.open,true);
     gridClose.click();
-    exit.click();ageClose.click();assert.deepEqual(exits,['https://www.google.com','https://www.google.com']);
+    exit.click();assert.deepEqual(exits,['https://www.google.com']);
   }finally{for(const [key,value] of Object.entries(originals)){if(value===undefined)delete globalThis[key];else globalThis[key]=value;}}
 });