import { mount } from '@vue/test-utils';
import { ref } from 'vue';
import { describe, expect, it, vi } from 'vitest';

import Activity from '../Activity.vue';

vi.mock('vue-i18n', () => ({
	useI18n: () => ({ locale: ref('zh_CN') }),
}));

vi.mock('shared/helpers/timeHelper', () => ({
	messageTimestamp: () => '8月6日 下午 3:12',
}));

const longURL =
	'https://ada.baidu.com/site/wjzt6ah8/agent?imid=e159aa97cd2c403f2fba76899e47615f&trinfo=XzFWIaclcWbzcMY&word=%E4%B8%89%E9%98%B3%E7%97%85%E6%AF%92%E6%90%BA%E5%B8%A6';

vi.mock('../../provider.js', () => ({
	useMessageContext: () => ({
		content: ref(`来源页面：<a href="${longURL}">${longURL}</a>`),
		createdAt: ref(1786018000),
	}),
}));

describe('Activity bubble', () => {
	it('allows long links in system messages to wrap inside the bubble', () => {
		const wrapper = mount(Activity, {
			global: {
				directives: {
					dompurifyHtml: (element, binding) => {
						element.innerHTML = binding.value;
					},
					tooltip: () => {},
				},
				stubs: {
					BaseBubble: {
						template: '<div><slot /></div>',
					},
				},
			},
		});

		expect(
			wrapper.get('[data-bubble-name="activity"]').classes()
		).toContain('max-w-full');

		const content = wrapper.get('span');
		expect(content.classes()).toContain('min-w-0');
		expect(content.classes()).toContain('max-w-full');
		expect(content.classes()).toContain('[overflow-wrap:anywhere]');
		expect(content.get('a').text()).toBe(longURL);
	});
});